<div dir="ltr">Hi guys,<div><br></div><div>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. </div><div><br></div><div>I was using #script together with #html:  while Esteban was using #onSuccess:/#onError: with #load and #html:</div><div><br></div><div>I created a class for testing the differences. Very simple:</div><div><br></div><div><div>renderContentOn: html</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">        </span>self renderMyDivOn: html.</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">        </span>html form: [ </div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                </span>html button</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>bePush; </div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>onClick: <b>(html jQuery ajax</b></div><div><b><span class="gmail-Apple-tab-span" style="white-space:pre">                                        </span>  <span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>script: [ :s |   </b><b>s &lt;&lt; ((s jQuery id: &#39;myDivId&#39; ) html: [:r |  </b><b>self renderMyDivOn: r. </b><b>]) </b><b>]</b></div><div><b><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>);</b></div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>value: &#39;Test with #script: &#39;.</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                </span></div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                </span>html button</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>bePush; </div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>onClick: <b>(html jQuery ajax</b></div><div><b><span class="gmail-Apple-tab-span" style="white-space:pre">                                        </span>callback: [  ];</b></div><div><b><span class="gmail-Apple-tab-span" style="white-space:pre">                                        </span>onSuccess: (  (html jQuery id: &#39;myDivId&#39;) load html: [ :r | self renderMyDivOn: r.  ] ) </b></div><div><b><span class="gmail-Apple-tab-span" style="white-space:pre">                                </span></b><b>);</b></div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>value: &#39;Test with #onSuccess:&#39;.<span class="gmail-Apple-tab-span" style="white-space:pre">                </span> </div><div><span class="gmail-Apple-tab-span" style="white-space:pre">        </span>]</div></div><div><br></div><div><br></div><div>And</div><div><br></div><div><div>renderMyDivOn: html</div><div><br></div><div><span class="gmail-Apple-tab-span" style="white-space:pre">        </span>html div</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                </span>id: &#39;myDivId&#39;;</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                </span>with: [ html text: DateAndTime now greaseString. ]</div></div><div><br></div><div><br></div><div>Both solutions works. But of course, they are different. The generated HTML is different too of course:</div><div><br></div><div><div><div>&lt;form accept-charset=&quot;utf-8&quot; method=&quot;post&quot; action=&quot;/reps?_s=pbHnnKA9Ys-E9FtR&amp;amp;_k=Wktdp8ek0iMZdSUY&quot;&gt;</div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                                </span><b>&lt;button onclick=&quot;$.ajax({&amp;quot;dataType&amp;quot;:&amp;quot;script&amp;quot;,&amp;quot;url&amp;quot;:&amp;quot;/reps&amp;quot;,&amp;quot;data&amp;quot;:[&amp;quot;_s=pbHnnKA9Ys-E9FtR&amp;quot;,&amp;quot;_k=Wktdp8ek0iMZdSUY&amp;quot;,&amp;quot;156&amp;quot;].join(&amp;quot;&amp;amp;&amp;quot;)})&quot; type=&quot;button&quot; class=&quot;button&quot;&gt;Test with #script:&lt;/button&gt;</b></div><div><br></div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                                </span> <b>&lt;button onclick=&quot;$.ajax({&amp;quot;url&amp;quot;:&amp;quot;/reps&amp;quot;,&amp;quot;data&amp;quot;:[&amp;quot;_s=pbHnnKA9Ys-E9FtR&amp;quot;,&amp;quot;_k=Wktdp8ek0iMZdSUY&amp;quot;,&amp;quot;157&amp;quot;].join(&amp;quot;&amp;amp;&amp;quot;),&amp;quot;success&amp;quot;:function(){$(&amp;quot;#myDivId&amp;quot;).load(&amp;quot;/reps&amp;quot;,[&amp;quot;_s=pbHnnKA9Ys-E9FtR&amp;quot;,&amp;quot;_k=Wktdp8ek0iMZdSUY&amp;quot;,&amp;quot;158&amp;quot;].join(&amp;quot;&amp;amp;&amp;quot;))}})&quot; type=&quot;button&quot; class=&quot;button&quot;&gt;Test with #onSuccess:&lt;/button&gt;</b></div><div><span class="gmail-Apple-tab-span" style="white-space:pre">                        </span>&lt;/form&gt;</div></div></div><div><br></div><div><br></div><div>I am not an AJAX expert, so I wonder what are the differences, which is the recommended approach, and why.</div><div><br></div><div>Thank you very much in advance. </div><div><br clear="all"><div><br></div>-- <br><div class="gmail_signature">Mariano<br><a href="http://marianopeck.wordpress.com" target="_blank">http://marianopeck.wordpress.com</a><br></div>
</div></div>