<div dir="ltr"><br><div class="gmail_extra"><br><div class="gmail_quote">On Sat, Sep 24, 2016 at 3:48 AM, Johan Brichau <span dir="ltr"><<a href="mailto:johan@inceptive.be" target="_blank">johan@inceptive.be</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">Hi Mariano,<br></blockquote><div><br></div><div>Hi Johan, Thanks for answering. My answers below. </div><div> </div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<br>
First button does a single ajax call and responds a js script.<br>
Second button does two ajax calls, first one without a response content, second one with a html response content.<br>
<br></blockquote><div><br></div><div>But which of the called methods generate each of both ajax calls? #ajax and #load ?</div><div><br></div><div> </div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
Both achieve the same end result but the second one requires two request-response cycles to your server.<br>
The second one will thus achieve the end result slower than the first one.<br>
<br>
We typically also try to optimize as much as possible into single ajax requests.<br></blockquote><div><br></div><div>OK. </div><div> </div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<br>
Mind that you _can_ combine a single primary and multiple secondary callback blocks into a single ajax call.<br>
A primary callback is a callback that responds a content to the client (#script:, #html:, #json:, #text, ….)<br>
A secondary callback is a callback that does not respond content (#callback:value:, #callback:passengers:, #callback:json: , …)<br>
There is an exception to this rule, #callback: is implemented in the Seaside jQuery binding as a primary callback, even if it does not return any content.<br>
<br>
Although for this example, I would actually write it as follows, because the #callback: block is a primary callback.<br>
<br>
html button<br>
bePush;<br>
onClick: (html jQuery id: ‘myDivId’ load html: [:r | | … do some other stuff …. then ... self renderMyDivOn: r. ] )<br>
value: ‘Test’<br>
<br></blockquote><div><br></div><div>OK. But you said that #callback: was a primary callback and we cannot have multiple primary callbacks in one ajax request. So my above example, where I was using #callback: .. let's say I have "callback: [ self doAnotherStuff ]". So in this example (with the second solution), I would actually be having THREE ajax calls?</div><div><br></div><div> </div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
Now, it also depends of the ‘myDivId’ is known when rendering the button or not, but in this simple example this would yield the same result ;)<br>
<br></blockquote><div><br></div><div>mmmmm could you mind explaining an example of this and how both solutions are different from this regard? </div><div><br></div><div>Thanks in advance Johan!</div><div><br></div><div><br></div><div> </div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
cheers<br>
Johan<br>
<div><div class="h5"><br>
> On 24 Sep 2016, at 04:19, Mariano Martinez Peck <<a href="mailto:marianopeck@gmail.com">marianopeck@gmail.com</a>> wrote:<br>
><br>
> Hi guys,<br>
><br>
> Today I have a discussion with Esteban Maringolo and it looks we are both doing something different for a classical AJAX example. Consider the typical example of a click on a button that should trigger the re-render of a given DIV.<br>
><br>
> I was using #script together with #html: while Esteban was using #onSuccess:/#onError: with #load and #html:<br>
><br>
> I created a class for testing the differences. Very simple:<br>
><br>
> renderContentOn: html<br>
> self renderMyDivOn: html.<br>
> html form: [<br>
> html button<br>
> bePush;<br>
> onClick: (html jQuery ajax<br>
> script: [ :s | s << ((s jQuery id: 'myDivId' ) html: [:r | self renderMyDivOn: r. ]) ]<br>
> );<br>
> value: 'Test with #script: '.<br>
><br>
> html button<br>
> bePush;<br>
> onClick: (html jQuery ajax<br>
> callback: [ ];<br>
> onSuccess: ( (html jQuery id: 'myDivId') load html: [ :r | self renderMyDivOn: r. ] )<br>
> );<br>
> value: 'Test with #onSuccess:'.<br>
> ]<br>
><br>
><br>
> And<br>
><br>
> renderMyDivOn: html<br>
><br>
> html div<br>
> id: 'myDivId';<br>
> with: [ html text: DateAndTime now greaseString. ]<br>
><br>
><br>
> Both solutions works. But of course, they are different. The generated HTML is different too of course:<br>
><br>
> <form accept-charset="utf-8" method="post" action="/reps?_s=pbHnnKA9Ys-<wbr>E9FtR&amp;_k=Wktdp8ek0iMZdSUY"<wbr>><br>
> <button onclick="$.ajax({&quot;<wbr>dataType&quot;:&quot;script&<wbr>quot;,&quot;url&quot;:&quot;/<wbr>reps&quot;,&quot;data&quot;:[&<wbr>quot;_s=pbHnnKA9Ys-E9FtR&quot;<wbr>,&quot;_k=Wktdp8ek0iMZdSUY&<wbr>quot;,&quot;156&quot;].join(&<wbr>quot;&amp;&quot;)})" type="button" class="button">Test with #script:</button><br>
><br>
> <button onclick="$.ajax({&quot;url&<wbr>quot;:&quot;/reps&quot;,&quot;<wbr>data&quot;:[&quot;_s=<wbr>pbHnnKA9Ys-E9FtR&quot;,&quot;_<wbr>k=Wktdp8ek0iMZdSUY&quot;,&<wbr>quot;157&quot;].join(&quot;&<wbr>amp;&quot;),&quot;success&<wbr>quot;:function(){$(&quot;#<wbr>myDivId&quot;).load(&quot;/<wbr>reps&quot;,[&quot;_s=<wbr>pbHnnKA9Ys-E9FtR&quot;,&quot;_<wbr>k=Wktdp8ek0iMZdSUY&quot;,&<wbr>quot;158&quot;].join(&quot;&<wbr>amp;&quot;))}})" type="button" class="button">Test with #onSuccess:</button><br>
> </form><br>
><br>
><br>
> I am not an AJAX expert, so I wonder what are the differences, which is the recommended approach, and why.<br>
><br>
> Thank you very much in advance.<br>
><br>
><br>
> --<br>
> Mariano<br>
> <a href="http://marianopeck.wordpress.com" rel="noreferrer" target="_blank">http://marianopeck.wordpress.<wbr>com</a><br>
</div></div>> ______________________________<wbr>_________________<br>
> seaside mailing list<br>
> <a href="mailto:seaside@lists.squeakfoundation.org">seaside@lists.<wbr>squeakfoundation.org</a><br>
> <a href="http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside" rel="noreferrer" target="_blank">http://lists.squeakfoundation.<wbr>org/cgi-bin/mailman/listinfo/<wbr>seaside</a><br>
<br>
______________________________<wbr>_________________<br>
seaside mailing list<br>
<a href="mailto:seaside@lists.squeakfoundation.org">seaside@lists.<wbr>squeakfoundation.org</a><br>
<a href="http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside" rel="noreferrer" target="_blank">http://lists.squeakfoundation.<wbr>org/cgi-bin/mailman/listinfo/<wbr>seaside</a><br>
</blockquote></div><br><br clear="all"><div><br></div>-- <br><div class="gmail_signature" data-smartmail="gmail_signature">Mariano<br><a href="http://marianopeck.wordpress.com" target="_blank">http://marianopeck.wordpress.com</a><br></div>
</div></div>