You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@cocoon.apache.org by Brian Maddy <bm...@kampersoftware.com> on 2006/01/20 00:24:41 UTC

CForms, Ajax, Visual Effects and onchange events

Hello,

I am making a form that uses ajax like in the car selector sample.  I 
would like to make another <div> on the page have the fade out visual 
effect when the form widgets are updated.

I am able to add events to the onchange attribute (I have to add the 
forms_submitForm() function also though), but the javascript is executed 
before the ajax stuff updates the browser's DOM.
<ft:widget id="address_city">
    <fi:styling onchange="forms_submitForm(this); alert('asdf');"/>
</ft:widget>

Does anyone here know how to trigger an event after the ajax update happens?

Thanks!
Brian


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
For additional commands, e-mail: users-help@cocoon.apache.org

Re: CForms, Ajax, Visual Effects and onchange events

Posted by Brian Maddy <bm...@kampersoftware.com>.

Jason Johnston wrote:

> Brian Maddy wrote:
>
>> Hello,
>>
>> I am making a form that uses ajax like in the car selector sample.  I 
>> would like to make another <div> on the page have the fade out visual 
>> effect when the form widgets are updated.
>>
>> I am able to add events to the onchange attribute (I have to add the 
>> forms_submitForm() function also though), but the javascript is 
>> executed before the ajax stuff updates the browser's DOM.
>
>
> Known issue: https://issues.apache.org/jira/browse/COCOON-1718
>
>> <ft:widget id="address_city">
>>    <fi:styling onchange="forms_submitForm(this); alert('asdf');"/>
>> </ft:widget>
>>
>> Does anyone here know how to trigger an event after the ajax update 
>> happens?
>
>
> You could potentially figure out what JS function gets called within 
> the ajax library post-update and override it to execute some of your 
> own code in addition to its normal behavior.  Unfortunately this ties 
> you to that specific ajax implementation, and I believe there are 
> plans in the works to replace it for some release in the 
> not-so-distant future.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
> For additional commands, e-mail: users-help@cocoon.apache.org
>
Well, I went back and looked at this again and was able to figure it 
out.  So here it is in case anyone else is trying to do the same thing:

<html>
...
<body>
...
            <script type="text/javascript">
            <![CDATA[
                // append some commands to be executed after the form is 
updated
                var oldProcessResponse = 
cocoon.ajax.BrowserUpdater.prototype.processResponse;
                cocoon.ajax.BrowserUpdater.prototype.processResponse = 
function(doc, request){
                    oldProcessResponse.apply(this, [doc, request]);
                    alert('asdf');
                }
            ]]>
            </script>
...
</body>
</html>

As Jason mentioned though, there is a warning near the cocoon.ajax.Fader 
function in resources/ajax/js/cocoon-ajax.js:

//-------------------------------------------------------------------------------------------------
// Fader used to highlight page areas that have been updated
// WARNING: don't rely too much on these effects, as they're very likely to be replaced
//          by some third party library in the near future
//-------------------------------------------------------------------------------------------------

So be weary of this if you are wanting to change the fading effects.

Brian





---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
For additional commands, e-mail: users-help@cocoon.apache.org

Re: CForms, Ajax, Visual Effects and onchange events

Posted by Jason Johnston <co...@lojjic.net>.
Brian Maddy wrote:
> Hello,
> 
> I am making a form that uses ajax like in the car selector sample.  I 
> would like to make another <div> on the page have the fade out visual 
> effect when the form widgets are updated.
> 
> I am able to add events to the onchange attribute (I have to add the 
> forms_submitForm() function also though), but the javascript is executed 
> before the ajax stuff updates the browser's DOM.

Known issue: https://issues.apache.org/jira/browse/COCOON-1718

> <ft:widget id="address_city">
>    <fi:styling onchange="forms_submitForm(this); alert('asdf');"/>
> </ft:widget>
> 
> Does anyone here know how to trigger an event after the ajax update 
> happens?

You could potentially figure out what JS function gets called within the 
ajax library post-update and override it to execute some of your own 
code in addition to its normal behavior.  Unfortunately this ties you to 
that specific ajax implementation, and I believe there are plans in the 
works to replace it for some release in the not-so-distant future.

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
For additional commands, e-mail: users-help@cocoon.apache.org