How can I invoke the callback of an anchor using jQuery?

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|

How can I invoke the callback of an anchor using jQuery?

Jan van de Sandt
Hello,

If I have an anchor with a callback:

html anchor
   callback: [ self doSomething ] ;
   with: 'DoIt'.

Now I want to use jQuery to update only part of the page instead of a full page reload:

html anchor
   callback: [ self doSomething ] ;
   onChange: (html jQuery ajax script: [ :s |
      s << (s jQuery: 'mydiv')
         html: [ :r | self renderMyDivOn: r ] ]) ;
   with: 'DoIt'.

How do I make sure that the callback is performed before the render method is executed? With form elements you can use serializeThis but I guess that doesn't work for anchor elements.

Jan

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How can I invoke the callback of an anchor using jQuery?

Johan Brichau-2
Jan,

A callback will always trigger a full page rendering. The callback mechanism works with a url in the anchor and therefore the browser expects a complete html page as a response.
Instead, try to do something along the lines of:

html anchor
        url: 'javascript:{}';
        onClick: (html jQuery ajax script: [ :s |
                        self doSomething;
      s << (s jQuery: 'mydiv')
          html: [ :r | self renderMyDivOn: r ] ]) ;
        with: 'doit'.

Basically: include the action inside the ajax callback, right before invoking the rendering.
If you want to separate the blocks, you will need to use a callback: [...]; onComplete:[...] construction, I think.
Overriding of the url has proven necessary to me to avoid default browser behavior.

Johan
       
On 14 Mar 2011, at 11:49, Jan van de Sandt wrote:

> Hello,
>
> If I have an anchor with a callback:
>
> html anchor
>    callback: [ self doSomething ] ;
>    with: 'DoIt'.
>
> Now I want to use jQuery to update only part of the page instead of a full page reload:
>
> html anchor
>    callback: [ self doSomething ] ;
>    onChange: (html jQuery ajax script: [ :s |
>       s << (s jQuery: 'mydiv')
>          html: [ :r | self renderMyDivOn: r ] ]) ;
>    with: 'DoIt'.
>
> How do I make sure that the callback is performed before the render method is executed? With form elements you can use serializeThis but I guess that doesn't work for anchor elements.
>
> Jan
> _______________________________________________
> seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How can I invoke the callback of an anchor using jQuery?

mmimica
Johan Brichau wrote:
> url: 'javascript:{}';
 >
> Overriding of the url has proven necessary to me to avoid default browser behavior.

And what is defualt browser behavior? I just do "url: '#';".


--
Milan Mimica
http://sparklet.sf.net
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How can I invoke the callback of an anchor using jQuery?

Jan van de Sandt
In reply to this post by Johan Brichau-2
Johan,

Thanks for the suggestion, I will try it out,

If I remember correctly the browser will not "follow" the url if the onClick code returns false. In this case you could leave the callback in place. The anchor would work in a browser without javascript and would use Ajax if javascript was available.

Jan.

On Mon, Mar 14, 2011 at 12:17 PM, Johan Brichau <[hidden email]> wrote:
Jan,

A callback will always trigger a full page rendering. The callback mechanism works with a url in the anchor and therefore the browser expects a complete html page as a response.
Instead, try to do something along the lines of:

html anchor
       url: 'javascript:{}';
       onClick: (html jQuery ajax script: [ :s |
                       self doSomething;
                        s << (s jQuery: 'mydiv')
                                       html: [ :r | self renderMyDivOn: r ] ]) ;
       with: 'doit'.

Basically: include the action inside the ajax callback, right before invoking the rendering.
If you want to separate the blocks, you will need to use a callback: [...]; onComplete:[...] construction, I think.
Overriding of the url has proven necessary to me to avoid default browser behavior.

Johan

On 14 Mar 2011, at 11:49, Jan van de Sandt wrote:

> Hello,
>
> If I have an anchor with a callback:
>
> html anchor
>    callback: [ self doSomething ] ;
>    with: 'DoIt'.
>
> Now I want to use jQuery to update only part of the page instead of a full page reload:
>
> html anchor
>    callback: [ self doSomething ] ;
>    onChange: (html jQuery ajax script: [ :s |
>       s << (s jQuery: 'mydiv')
>          html: [ :r | self renderMyDivOn: r ] ]) ;
>    with: 'DoIt'.
>
> How do I make sure that the callback is performed before the render method is executed? With form elements you can use serializeThis but I guess that doesn't work for anchor elements.
>
> Jan
> _______________________________________________
> seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside


_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside