JQuery load question
Locked
 
|
Hi,
I had some code that worked fine using JQuery's load functionality: html div id: #foo html button bePush; onClick: ((html jQuery id: #foo) load html: [ :h | myModel doSomething. h render: myModel displayString ]); with: 'Do Something' Now, I switched #foo to a form input: html textInput id: #foo But then I should use #value: and not replace the HTML so I can't use load anymore. I don't seem to be able to write this but I am a real beginner here. Anyone ? Thx, Sven PS: the data coming back is just a string, not HTML. _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
|
|
Hi Sven,
In theory, you can still use load and render the entire input field again. But you are right that setting the value of the input field is a better approach because replacing the entire field often messes with the keyboard focus. What you need is a script callback: (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] I hope this is what you were looking for. Johan On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: > Hi, > > I had some code that worked fine using JQuery's load functionality: > > html div id: #foo > > html button > bePush; > onClick: ((html jQuery id: #foo) load html: [ :h | > myModel doSomething. > h render: myModel displayString ]); > with: 'Do Something' > > Now, I switched #foo to a form input: > > html textInput id: #foo > > But then I should use #value: and not replace the HTML so I can't use load anymore. > > I don't seem to be able to write this but I am a real beginner here. Anyone ? > > Thx, > > Sven > > PS: the data coming back is just a string, not HTML. > > _______________________________________________ > 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 |
|
|
In reply to this post by Sven Van Caekenberghe-2
Sven,
If I understand correctly, what you'd like to do is to replace the contents of a text input, and therefor you do not need to render anything on the server side, right? So you'd like to call $('#foo').value("myModel displayString"); - is that correct? To me this sounds like you need to do an ajax call that returns just the string and onComplete: replaces the contents of the text input. Joachim Am 19.05.14 14:59, schrieb Sven Van Caekenberghe: > Hi, > > I had some code that worked fine using JQuery's load functionality: > > html div id: #foo > > html button > bePush; > onClick: ((html jQuery id: #foo) load html: [ :h | > myModel doSomething. > h render: myModel displayString ]); > with: 'Do Something' > > Now, I switched #foo to a form input: > > html textInput id: #foo > > But then I should use #value: and not replace the HTML so I can't use load anymore. > > I don't seem to be able to write this but I am a real beginner here. Anyone ? > > Thx, > > Sven > > PS: the data coming back is just a string, not HTML. > > _______________________________________________ > seaside mailing list > [hidden email] > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside > -- ----------------------------------------------------------------------- Objektfabrik Joachim Tuchel mailto:[hidden email] Fliederweg 1 http://www.objektfabrik.de D-71640 Ludwigsburg http://joachimtuchel.wordpress.com Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
|
|
In reply to this post by Johan Brichau-2
Hi Johan,
your suggestion looks very similar to what I had in mind, apart from the fact that you don't use onComplete:. So I suggest there is something to learn in this for me. I thought I'd have to use (the deprecated) onComplete: block with the Ajax object just to make sure the ajax callback is finished before I update the input field. So using your code and my idea it would look more like this: (html jQuery ajax script: [:s | myModel doSomething]; onComplete: [:s| s << ((s jQuery id: #foo) value: myModel displayString) (I just edited your code, there might be typos or errors in it). So I'd be interested in your thoughts on this since I am still a very early stage learner in this area.... Joachim Am 19.05.14 15:06, schrieb Johan Brichau: > Hi Sven, > > In theory, you can still use load and render the entire input field again. > But you are right that setting the value of the input field is a better approach because replacing the entire field often messes with the keyboard focus. > > What you need is a script callback: > > (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] > > I hope this is what you were looking for. > > Johan > > On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: > >> Hi, >> >> I had some code that worked fine using JQuery's load functionality: >> >> html div id: #foo >> >> html button >> bePush; >> onClick: ((html jQuery id: #foo) load html: [ :h | >> myModel doSomething. >> h render: myModel displayString ]); >> with: 'Do Something' >> >> Now, I switched #foo to a form input: >> >> html textInput id: #foo >> >> But then I should use #value: and not replace the HTML so I can't use load anymore. >> >> I don't seem to be able to write this but I am a real beginner here. Anyone ? >> >> Thx, >> >> Sven >> >> PS: the data coming back is just a string, not HTML. >> >> _______________________________________________ >> 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 > -- ----------------------------------------------------------------------- Objektfabrik Joachim Tuchel mailto:[hidden email] Fliederweg 1 http://www.objektfabrik.de D-71640 Ludwigsburg http://joachimtuchel.wordpress.com Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
Re: JQuery load question
|
|
In reply to this post by Johan Brichau-2
Johan,
I was hoping you would answer ;-) Yes, that works perfectly ! Thanks a lot. Sven PS: Since you really know so much about this subject, it would help us all tremendously if you wrote some documentation beyond what is in the Seaside book - there is so much missing... On 19 May 2014, at 15:06, Johan Brichau <[hidden email]> wrote: > Hi Sven, > > In theory, you can still use load and render the entire input field again. > But you are right that setting the value of the input field is a better approach because replacing the entire field often messes with the keyboard focus. > > What you need is a script callback: > > (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] > > I hope this is what you were looking for. > > Johan > > On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: > >> Hi, >> >> I had some code that worked fine using JQuery's load functionality: >> >> html div id: #foo >> >> html button >> bePush; >> onClick: ((html jQuery id: #foo) load html: [ :h | >> myModel doSomething. >> h render: myModel displayString ]); >> with: 'Do Something' >> >> Now, I switched #foo to a form input: >> >> html textInput id: #foo >> >> But then I should use #value: and not replace the HTML so I can't use load anymore. >> >> I don't seem to be able to write this but I am a real beginner here. Anyone ? >> >> Thx, >> >> Sven >> >> PS: the data coming back is just a string, not HTML. >> >> _______________________________________________ >> 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 |
|
|
In reply to this post by jtuchel
My snippet is at least syntactically correct with a closing bracket ;-)
(html jQuery ajax script: [:s | myModel doSomething]; onComplete: [:s| s << ((s jQuery id: #foo) value: myModel displayString]) One thing I may have overseen is that the question I am raising is probably only relevant if #doSomething in has any influence on what #displayString actually looks like. So as long as displayString is not influenced by #doSomething, Johan's solution is perfect. ... or I am not understanding something, which is very well possible Joachim Am 19.05.14 15:12, schrieb [hidden email]: > Hi Johan, > > your suggestion looks very similar to what I had in mind, apart from > the fact that you don't use onComplete:. So I suggest there is > something to learn in this for me. I thought I'd have to use (the > deprecated) onComplete: block with the Ajax object just to make sure > the ajax callback is finished before I update the input field. So > using your code and my idea it would look more like this: > > > (html jQuery ajax > script: [:s | myModel doSomething]; > onComplete: [:s| s << ((s jQuery id: #foo) value: myModel > displayString) > > (I just edited your code, there might be typos or errors in it). > > So I'd be interested in your thoughts on this since I am still a very > early stage learner in this area.... > > Joachim > > > Am 19.05.14 15:06, schrieb Johan Brichau: >> Hi Sven, >> >> In theory, you can still use load and render the entire input field >> again. >> But you are right that setting the value of the input field is a >> better approach because replacing the entire field often messes with >> the keyboard focus. >> >> What you need is a script callback: >> >> (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery >> id: #foo) value: myModel displayString)] >> >> I hope this is what you were looking for. >> >> Johan >> >> On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: >> >>> Hi, >>> >>> I had some code that worked fine using JQuery's load functionality: >>> >>> html div id: #foo >>> >>> html button >>> bePush; >>> onClick: ((html jQuery id: #foo) load html: [ :h | >>> myModel doSomething. >>> h render: myModel displayString ]); >>> with: 'Do Something' >>> >>> Now, I switched #foo to a form input: >>> >>> html textInput id: #foo >>> >>> But then I should use #value: and not replace the HTML so I can't >>> use load anymore. >>> >>> I don't seem to be able to write this but I am a real beginner here. >>> Anyone ? >>> >>> Thx, >>> >>> Sven >>> >>> PS: the data coming back is just a string, not HTML. >>> >>> _______________________________________________ >>> 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 >> > > -- ----------------------------------------------------------------------- Objektfabrik Joachim Tuchel mailto:[hidden email] Fliederweg 1 http://www.objektfabrik.de D-71640 Ludwigsburg http://joachimtuchel.wordpress.com Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
Re: JQuery load question
|
|
On 19 May 2014, at 15:16, [hidden email] wrote: > My snippet is at least syntactically correct with a closing bracket ;-) > > (html jQuery ajax > script: [:s | myModel doSomething]; > onComplete: [:s| s << ((s jQuery id: #foo) value: myModel displayString]) > > One thing I may have overseen is that the question I am raising is probably only relevant if #doSomething in has any influence on what #displayString actually looks like. So as long as displayString is not influenced by #doSomething, Johan's solution is perfect. Yes, #displayString is dynamic and changes as a result of #doSomething. I stumbled upon #onComplete: as well, but could not figure out how to use it... This whole area is a bit special: when you see solutions (or presentations about this) it all looks beautiful and elegant, and you think you understand it, but when you have to change it you get so easily stuck, frustrating. > ... or I am not understanding something, which is very well possible > > Joachim > > > Am 19.05.14 15:12, schrieb [hidden email]: >> Hi Johan, >> >> your suggestion looks very similar to what I had in mind, apart from the fact that you don't use onComplete:. So I suggest there is something to learn in this for me. I thought I'd have to use (the deprecated) onComplete: block with the Ajax object just to make sure the ajax callback is finished before I update the input field. So using your code and my idea it would look more like this: >> >> >> (html jQuery ajax >> script: [:s | myModel doSomething]; >> onComplete: [:s| s << ((s jQuery id: #foo) value: myModel displayString) >> >> (I just edited your code, there might be typos or errors in it). >> >> So I'd be interested in your thoughts on this since I am still a very early stage learner in this area.... >> >> Joachim >> >> >> Am 19.05.14 15:06, schrieb Johan Brichau: >>> Hi Sven, >>> >>> In theory, you can still use load and render the entire input field again. >>> But you are right that setting the value of the input field is a better approach because replacing the entire field often messes with the keyboard focus. >>> >>> What you need is a script callback: >>> >>> (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] >>> >>> I hope this is what you were looking for. >>> >>> Johan >>> >>> On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: >>> >>>> Hi, >>>> >>>> I had some code that worked fine using JQuery's load functionality: >>>> >>>> html div id: #foo >>>> >>>> html button >>>> bePush; >>>> onClick: ((html jQuery id: #foo) load html: [ :h | >>>> myModel doSomething. >>>> h render: myModel displayString ]); >>>> with: 'Do Something' >>>> >>>> Now, I switched #foo to a form input: >>>> >>>> html textInput id: #foo >>>> >>>> But then I should use #value: and not replace the HTML so I can't use load anymore. >>>> >>>> I don't seem to be able to write this but I am a real beginner here. Anyone ? >>>> >>>> Thx, >>>> >>>> Sven >>>> >>>> PS: the data coming back is just a string, not HTML. >>>> >>>> _______________________________________________ >>>> 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 >>> >> >> > > > -- > ----------------------------------------------------------------------- > Objektfabrik Joachim Tuchel mailto:[hidden email] > Fliederweg 1 http://www.objektfabrik.de > D-71640 Ludwigsburg http://joachimtuchel.wordpress.com > Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 > > _______________________________________________ > 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 |
|
|
Am 19.05.14 15:29, schrieb Sven Van Caekenberghe:
> Yes, #displayString is dynamic and changes as a result of > #doSomething. I stumbled upon #onComplete: as well, but could not > figure out how to use it... This whole area is a bit special: when you > see solutions (or presentations about this) it all looks beautiful and > elegant, and you think you understand it, but when you have to change > it you get so easily stuck, frustrating. So true. The best thing that helps is writing a bit of Javascript to understand all of this better. And I am still at the beginning of my journey. For some situations I switched to pure Javascript and stream it using JSStream on: 'myJavaScriptCode()' instead of Seaside's rendering helpers. Joachim -- ----------------------------------------------------------------------- Objektfabrik Joachim Tuchel mailto:[hidden email] Fliederweg 1 http://www.objektfabrik.de D-71640 Ludwigsburg http://joachimtuchel.wordpress.com Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
|
|
In reply to this post by jtuchel
Hi Joachim,
Ok, I went through these stages of learning as well, so let me try to compress all those steps in my reply ;-) I think you meant the following snippet (i.e. an ajax callback and ajax script callback in the oncomplete): html jQuery ajax callback: [ myModel doSomething]; onComplete: (html jQuery ajax script: [:s| s << ((s jQuery id: #foo) value: myModel displayString)]) That looks conceptually clean: the action callback is separated from the 'rendering' callback. Moreover, you explicitly enforce that the rendering has to wait until the action took place. This works. But: there are two requests being made to the server here, where second the one is only fired after the first one finished. That is a lot of delay. So, what I generally do is combine callback actions to as few *real* callbacks as possible. One part of that is done by the Seaside binding for jQuery ajax and other part can be done manually. In the example, I did a manual 'optimization' by writing the 'action' (myModel doSomething) inside the script callback: html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] If you understand how Seaside combines callbacks on a single (ajax) request, you would also write it as follows: html jQuery ajax callback:[myModel doSomething]; script: [:s | s << ((s jQuery id: #foo) value: myModel displayString)] The ajax call will fire both callbacks and the *rendering* callback will always be fired last (since that is the one producing a response). Obviously, you cannot combine multiple response-rendering callbacks. This is something that is too much hidden inside the implementation and I only noticed that this could be done after Lukas wrote it down once. So, yes, this should be better documented (I hope I can spend some time on that soon...). Mind that the following snippet would give wrong results: html jQuery ajax callback:[myModel doSomething]; onComplete: ((html jQuery id: #foo) value: myModel displayString) The above is wrong because the script in the onComplete is generated together with the ajax call. The value of 'myModel displayString' will thus _not_ be the value after the execution of 'myModel doSomething'. You will effectively replace it with the value that it had when you generated the page with the ajax callback on. When creating these scripts, it is very important to understand when something is executed (i.e. when the script is generated or when the callback happens). Once you understand that, it's just a matter of understanding the jQuery library itself. I hope this quick write-up already helps you guys a bit. Johan On 19 May 2014, at 15:12, [hidden email] wrote: > Hi Johan, > > your suggestion looks very similar to what I had in mind, apart from the fact that you don't use onComplete:. So I suggest there is something to learn in this for me. I thought I'd have to use (the deprecated) onComplete: block with the Ajax object just to make sure the ajax callback is finished before I update the input field. So using your code and my idea it would look more like this: > > > (html jQuery ajax > script: [:s | myModel doSomething]; > onComplete: [:s| s << ((s jQuery id: #foo) value: myModel displayString) > > (I just edited your code, there might be typos or errors in it). > > So I'd be interested in your thoughts on this since I am still a very early stage learner in this area.... > > Joachim > > > Am 19.05.14 15:06, schrieb Johan Brichau: >> Hi Sven, >> >> In theory, you can still use load and render the entire input field again. >> But you are right that setting the value of the input field is a better approach because replacing the entire field often messes with the keyboard focus. >> >> What you need is a script callback: >> >> (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] >> >> I hope this is what you were looking for. >> >> Johan >> >> On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: >> >>> Hi, >>> >>> I had some code that worked fine using JQuery's load functionality: >>> >>> html div id: #foo >>> >>> html button >>> bePush; >>> onClick: ((html jQuery id: #foo) load html: [ :h | >>> myModel doSomething. >>> h render: myModel displayString ]); >>> with: 'Do Something' >>> >>> Now, I switched #foo to a form input: >>> >>> html textInput id: #foo >>> >>> But then I should use #value: and not replace the HTML so I can't use load anymore. >>> >>> I don't seem to be able to write this but I am a real beginner here. Anyone ? >>> >>> Thx, >>> >>> Sven >>> >>> PS: the data coming back is just a string, not HTML. >>> >>> _______________________________________________ >>> 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 >> > > > -- > ----------------------------------------------------------------------- > Objektfabrik Joachim Tuchel mailto:[hidden email] > Fliederweg 1 http://www.objektfabrik.de > D-71640 Ludwigsburg http://joachimtuchel.wordpress.com > Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 > > _______________________________________________ > 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 |
|
|
Wow, you know, as Sven puts it: every time you think you understand this
a little better, somebody (most of the time it's you ;-) ) comes around the corner and tells you a few more enlightening details. So there is quite some stuff to chew on (again)... Thanks for your explanations. Joachim Am 19.05.14 15:43, schrieb Johan Brichau: > Hi Joachim, > > Ok, I went through these stages of learning as well, so let me try to compress all those steps in my reply ;-) > > I think you meant the following snippet (i.e. an ajax callback and ajax script callback in the oncomplete): > > html jQuery ajax > callback: [ myModel doSomething]; > onComplete: (html jQuery ajax script: [:s| s << ((s jQuery id: #foo) value: myModel displayString)]) > > That looks conceptually clean: the action callback is separated from the 'rendering' callback. > Moreover, you explicitly enforce that the rendering has to wait until the action took place. This works. > > But: there are two requests being made to the server here, where second the one is only fired after the first one finished. That is a lot of delay. > So, what I generally do is combine callback actions to as few *real* callbacks as possible. One part of that is done by the Seaside binding for jQuery ajax and other part can be done manually. > In the example, I did a manual 'optimization' by writing the 'action' (myModel doSomething) inside the script callback: > > html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] > > If you understand how Seaside combines callbacks on a single (ajax) request, you would also write it as follows: > > html jQuery ajax > callback:[myModel doSomething]; > script: [:s | s << ((s jQuery id: #foo) value: myModel displayString)] > > The ajax call will fire both callbacks and the *rendering* callback will always be fired last (since that is the one producing a response). > Obviously, you cannot combine multiple response-rendering callbacks. This is something that is too much hidden inside the implementation and I only noticed that this could be done after Lukas wrote it down once. So, yes, this should be better documented (I hope I can spend some time on that soon...). > > Mind that the following snippet would give wrong results: > > html jQuery ajax > callback:[myModel doSomething]; > onComplete: ((html jQuery id: #foo) value: myModel displayString) > > The above is wrong because the script in the onComplete is generated together with the ajax call. The value of 'myModel displayString' will thus _not_ be the value after the execution of 'myModel doSomething'. You will effectively replace it with the value that it had when you generated the page with the ajax callback on. When creating these scripts, it is very important to understand when something is executed (i.e. when the script is generated or when the callback happens). Once you understand that, it's just a matter of understanding the jQuery library itself. > > I hope this quick write-up already helps you guys a bit. > > Johan > > On 19 May 2014, at 15:12, [hidden email] wrote: > >> Hi Johan, >> >> your suggestion looks very similar to what I had in mind, apart from the fact that you don't use onComplete:. So I suggest there is something to learn in this for me. I thought I'd have to use (the deprecated) onComplete: block with the Ajax object just to make sure the ajax callback is finished before I update the input field. So using your code and my idea it would look more like this: >> >> >> (html jQuery ajax >> script: [:s | myModel doSomething]; >> onComplete: [:s| s << ((s jQuery id: #foo) value: myModel displayString) >> >> (I just edited your code, there might be typos or errors in it). >> >> So I'd be interested in your thoughts on this since I am still a very early stage learner in this area.... >> >> Joachim >> >> >> Am 19.05.14 15:06, schrieb Johan Brichau: >>> Hi Sven, >>> >>> In theory, you can still use load and render the entire input field again. >>> But you are right that setting the value of the input field is a better approach because replacing the entire field often messes with the keyboard focus. >>> >>> What you need is a script callback: >>> >>> (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] >>> >>> I hope this is what you were looking for. >>> >>> Johan >>> >>> On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: >>> >>>> Hi, >>>> >>>> I had some code that worked fine using JQuery's load functionality: >>>> >>>> html div id: #foo >>>> >>>> html button >>>> bePush; >>>> onClick: ((html jQuery id: #foo) load html: [ :h | >>>> myModel doSomething. >>>> h render: myModel displayString ]); >>>> with: 'Do Something' >>>> >>>> Now, I switched #foo to a form input: >>>> >>>> html textInput id: #foo >>>> >>>> But then I should use #value: and not replace the HTML so I can't use load anymore. >>>> >>>> I don't seem to be able to write this but I am a real beginner here. Anyone ? >>>> >>>> Thx, >>>> >>>> Sven >>>> >>>> PS: the data coming back is just a string, not HTML. >>>> >>>> _______________________________________________ >>>> 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 >>> >> >> -- >> ----------------------------------------------------------------------- >> Objektfabrik Joachim Tuchel mailto:[hidden email] >> Fliederweg 1 http://www.objektfabrik.de >> D-71640 Ludwigsburg http://joachimtuchel.wordpress.com >> Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 >> >> _______________________________________________ >> 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 > -- ----------------------------------------------------------------------- Objektfabrik Joachim Tuchel mailto:[hidden email] Fliederweg 1 http://www.objektfabrik.de D-71640 Ludwigsburg http://joachimtuchel.wordpress.com Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
|
|
In reply to this post by jtuchel
On 19 May 2014, at 15:16, [hidden email] wrote: > One thing I may have overseen is that the question I am raising is probably only relevant if #doSomething in has any influence on what #displayString actually looks like. So as long as displayString is not influenced by #doSomething, Johan's solution is perfect. But the #displayString is sent after the #doSomething, so that works just fine. Mind that an ajax callback does not follow Seaside's two-phase requests (i.e. action following by render). An ajax callback is an action callback that updates the current continuation (or session state) 'in place'. You don't need to separate state modifications from rendering code. Though, you do have to be a bit careful when you do state modifications over a GET request.... I can tell you stories about security software in proxies and routers that replay every GET request a couple of minutes afterwards. But it's easy to make an ajax request a POST request... and SSL helps too. Johan_______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
Re: JQuery load question
|
|
In reply to this post by Johan Brichau-2
Thx, Johan.
On 19 May 2014, at 15:43, Johan Brichau <[hidden email]> wrote: > Hi Joachim, > > Ok, I went through these stages of learning as well, so let me try to compress all those steps in my reply ;-) > > I think you meant the following snippet (i.e. an ajax callback and ajax script callback in the oncomplete): > > html jQuery ajax > callback: [ myModel doSomething]; > onComplete: (html jQuery ajax script: [:s| s << ((s jQuery id: #foo) value: myModel displayString)]) > > That looks conceptually clean: the action callback is separated from the 'rendering' callback. > Moreover, you explicitly enforce that the rendering has to wait until the action took place. This works. > > But: there are two requests being made to the server here, where second the one is only fired after the first one finished. That is a lot of delay. > So, what I generally do is combine callback actions to as few *real* callbacks as possible. One part of that is done by the Seaside binding for jQuery ajax and other part can be done manually. > In the example, I did a manual 'optimization' by writing the 'action' (myModel doSomething) inside the script callback: > > html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] > > If you understand how Seaside combines callbacks on a single (ajax) request, you would also write it as follows: > > html jQuery ajax > callback:[myModel doSomething]; > script: [:s | s << ((s jQuery id: #foo) value: myModel displayString)] > > The ajax call will fire both callbacks and the *rendering* callback will always be fired last (since that is the one producing a response). > Obviously, you cannot combine multiple response-rendering callbacks. This is something that is too much hidden inside the implementation and I only noticed that this could be done after Lukas wrote it down once. So, yes, this should be better documented (I hope I can spend some time on that soon...). > > Mind that the following snippet would give wrong results: > > html jQuery ajax > callback:[myModel doSomething]; > onComplete: ((html jQuery id: #foo) value: myModel displayString) > > The above is wrong because the script in the onComplete is generated together with the ajax call. The value of 'myModel displayString' will thus _not_ be the value after the execution of 'myModel doSomething'. You will effectively replace it with the value that it had when you generated the page with the ajax callback on. When creating these scripts, it is very important to understand when something is executed (i.e. when the script is generated or when the callback happens). Once you understand that, it's just a matter of understanding the jQuery library itself. > > I hope this quick write-up already helps you guys a bit. > > Johan > > On 19 May 2014, at 15:12, [hidden email] wrote: > >> Hi Johan, >> >> your suggestion looks very similar to what I had in mind, apart from the fact that you don't use onComplete:. So I suggest there is something to learn in this for me. I thought I'd have to use (the deprecated) onComplete: block with the Ajax object just to make sure the ajax callback is finished before I update the input field. So using your code and my idea it would look more like this: >> >> >> (html jQuery ajax >> script: [:s | myModel doSomething]; >> onComplete: [:s| s << ((s jQuery id: #foo) value: myModel displayString) >> >> (I just edited your code, there might be typos or errors in it). >> >> So I'd be interested in your thoughts on this since I am still a very early stage learner in this area.... >> >> Joachim >> >> >> Am 19.05.14 15:06, schrieb Johan Brichau: >>> Hi Sven, >>> >>> In theory, you can still use load and render the entire input field again. >>> But you are right that setting the value of the input field is a better approach because replacing the entire field often messes with the keyboard focus. >>> >>> What you need is a script callback: >>> >>> (html jQuery ajax script: [:s | myModel doSomething. s << ((s jQuery id: #foo) value: myModel displayString)] >>> >>> I hope this is what you were looking for. >>> >>> Johan >>> >>> On 19 May 2014, at 14:59, Sven Van Caekenberghe <[hidden email]> wrote: >>> >>>> Hi, >>>> >>>> I had some code that worked fine using JQuery's load functionality: >>>> >>>> html div id: #foo >>>> >>>> html button >>>> bePush; >>>> onClick: ((html jQuery id: #foo) load html: [ :h | >>>> myModel doSomething. >>>> h render: myModel displayString ]); >>>> with: 'Do Something' >>>> >>>> Now, I switched #foo to a form input: >>>> >>>> html textInput id: #foo >>>> >>>> But then I should use #value: and not replace the HTML so I can't use load anymore. >>>> >>>> I don't seem to be able to write this but I am a real beginner here. Anyone ? >>>> >>>> Thx, >>>> >>>> Sven >>>> >>>> PS: the data coming back is just a string, not HTML. >>>> >>>> _______________________________________________ >>>> 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 >>> >> >> >> -- >> ----------------------------------------------------------------------- >> Objektfabrik Joachim Tuchel mailto:[hidden email] >> Fliederweg 1 http://www.objektfabrik.de >> D-71640 Ludwigsburg http://joachimtuchel.wordpress.com >> Telefon: +49 7141 56 10 86 0 Fax: +49 7141 56 10 86 1 >> >> _______________________________________________ >> 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 |
«
Return to Seaside General
|
1 view|%1 views
| Free forum by Nabble | Edit this page |