jQuery variable check for onBlur
Locked
 
|
I posted this on Stack Overflow... no answer so far: How do I code a variable check into a Seaside jQuery onSuccess: script? I have an application with input fields that trigger a value change followed by a re-rendering of the view. It works nicely to provide lively feedback of domain data based on displayed values. The view shows 'Save' and 'Cancel' buttons if there are changes pending. If the user clicks on either button right after an input field, the onBlur: script of the input fields prevents the button action from taking place. The recommended solution (button click event lost due to the alert box in text box onblur event) is to use the button's 'onmousedown' event to set a global variable that the onBlur script checks. With my test code I can see the global 'saveCancelButtonClicked' being set, but I don't know how to check the value in order to prevent the rendering step. I can see the console.log showing '1' if the save button is pressed. So how do I check the value and skip the 'self renderSelectedComponentOn:' step? It's easy enough to do in javascript (trivial if statement), but I have not found an example in Seaside. Thanks for any help, Bob Nemec _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Bob Nemec
|
|
|
Hi Bob,
I guess what you are looking for is JSIfThenElse. I have no example at hand, but remember two things about it: * It feels strange to send then:else: to a JSObject. Not very Smalltalkish. * It does have a bug that I reported on this list a long time ago. It only renders the (if) ? then : else; form. So you should change #javascripContentOn: to javascriptContentOn: aStream aStream nextPutAll: 'if('. super javascriptContentOn: aStream. aStream nextPutAll: ') {'. aStream javascript: self trueStatement. aStream nextPutAll: '} else {'. aStream javascript: self falseStatement. aStream nextPut: $}. for more complex statements. In your case, what you need to do first is produce a JSObject that represents the results of the client-side check "saveCancelButtonClicked == 1" and send it #then: or #then:else. I'd be interested in how you can create that JSObject... I guess it's easy.... Joachim Am 10.04.13 14:59, schrieb [hidden email]: > I posted this on Stack Overflow... no answer so far: > How do I code a variable check into a Seaside jQuery onSuccess: script? > I have an application with input fields that trigger a value change > followed by a re-rendering of the view. It works nicely to provide > lively feedback of domain data based on displayed values. > The view shows 'Save' and 'Cancel' buttons if there are changes > pending. If the user clicks on either button right after an input > field, the onBlur: script of the input fields prevents the button > action from taking place. The recommended solution (button click event > lost due to the alert box in text box onblur event > <http://stackoverflow.com/questions/3245350/button-click-event-lost-due-to-the-alert-box-in-text-box-onblur-event>) > is to use the button's 'onmousedown' event to set a global variable > that the onBlur script checks. > With my test code I can see the global 'saveCancelButtonClicked' being > set, but I don't know how to check the value in order to prevent the > rendering step. > |html button > onMouseDown: 'saveCancelButtonClicked = 1;'; > ... > > html textInput > onBlur: (( > html jQuery ajax > callback: [:stringValue| self checkValue: stringValue] > value: html jQuerythis value) > onSuccess: ( > (html jQuery id: 'selectedComponent') load html: [:renderer| > renderer script: 'console.log(saveCancelButtonClicked);'. > self renderSelectedComponentOn: renderer]) )]| > I can see the console.log showing '1' if the save button is pressed. > So how do I check the value and skip the 'self > renderSelectedComponentOn:' step? > It's easy enough to do in javascript (trivial if statement), but I > have not found an example in Seaside. > Thanks for any help, > Bob Nemec > > > _______________________________________________ > 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 |
|
|
Hi again,
without having tested it, this may look something like onSuccess: ( (JSStream on: 'saveCancelButtonClicked == 1') then: ((html jQuery id: 'selectedComponent') load html: [:renderer| self renderSelectedComponentOn: renderer])) else: ....) Please let us know how the code ends up looking once you solved. I'd be very interested to learn more about this. Joachim Am 10.04.13 15:09, schrieb [hidden email]: > Hi Bob, > > I guess what you are looking for is JSIfThenElse. I have no example at > hand, but remember two things about it: > * It feels strange to send then:else: to a JSObject. Not very > Smalltalkish. > * It does have a bug that I reported on this list a long time ago. It > only renders the (if) ? then : else; form. So you should change > #javascripContentOn: to > > javascriptContentOn: aStream > aStream nextPutAll: 'if('. > super javascriptContentOn: aStream. > aStream nextPutAll: ') {'. > aStream javascript: self trueStatement. > aStream nextPutAll: '} else {'. > aStream javascript: self falseStatement. > aStream nextPut: $}. > > for more complex statements. > > In your case, what you need to do first is produce a JSObject that > represents the results of the client-side check > "saveCancelButtonClicked == 1" and send it #then: or #then:else. I'd > be interested in how you can create that JSObject... I guess it's > easy.... > > Joachim > > > Am 10.04.13 14:59, schrieb [hidden email]: >> I posted this on Stack Overflow... no answer so far: >> How do I code a variable check into a Seaside jQuery onSuccess: script? >> I have an application with input fields that trigger a value change >> followed by a re-rendering of the view. It works nicely to provide >> lively feedback of domain data based on displayed values. >> The view shows 'Save' and 'Cancel' buttons if there are changes >> pending. If the user clicks on either button right after an input >> field, the onBlur: script of the input fields prevents the button >> action from taking place. The recommended solution (button click >> event lost due to the alert box in text box onblur event >> <http://stackoverflow.com/questions/3245350/button-click-event-lost-due-to-the-alert-box-in-text-box-onblur-event>) >> is to use the button's 'onmousedown' event to set a global variable >> that the onBlur script checks. >> With my test code I can see the global 'saveCancelButtonClicked' >> being set, but I don't know how to check the value in order to >> prevent the rendering step. >> |html button >> onMouseDown: 'saveCancelButtonClicked = 1;'; ... >> >> html textInput >> onBlur: (( >> html jQuery ajax >> callback: [:stringValue| self checkValue: stringValue] >> value: html jQuerythis value) >> onSuccess: ( >> (html jQuery id: 'selectedComponent') load html: >> [:renderer| renderer script: >> 'console.log(saveCancelButtonClicked);'. >> self renderSelectedComponentOn: renderer]) )]| >> I can see the console.log showing '1' if the save button is pressed. >> So how do I check the value and skip the 'self >> renderSelectedComponentOn:' step? >> It's easy enough to do in javascript (trivial if statement), but I >> have not found an example in Seaside. >> Thanks for any help, >> Bob Nemec >> >> >> _______________________________________________ >> 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 |
|
|
Excellent, it worked great... onSuccess: ( (Javascript.JSStream on: 'saveCancelButtonClicked == 0') then: ( (html jQuery id: 'portalSelectedComponent') load html: [:renderer | ...the method that renders the save and cancel buttons contains... html script: 'saveCancelButtonClicked = 0;' . ...both the save and cancel buttons implement... onMouseDown: 'saveCancelButtonClicked = 1;'; ...works just as I wanted: pressing either the 'Save' or 'Cancel' button after updating an input field triggers the callback on the first click. And losing focus triggers the input field onBlur action normally. Thanks, Bob From: "[hidden email]" <[hidden email]> To: [hidden email] Sent: Wednesday, April 10, 2013 9:21:52 AM Subject: Re: [Seaside] jQuery variable check for onBlur Hi again, without having tested it, this may look something like onSuccess: ( (JSStream on: 'saveCancelButtonClicked == 1') then: ((html jQuery id: 'selectedComponent') load html: [:renderer| self renderSelectedComponentOn: renderer])) else: ....) Please let us know how the code ends up looking once you solved. I'd be very interested to learn more about this. Joachim Am 10.04.13 15:09, schrieb [hidden email]: > Hi Bob, > > I guess what you are looking for is JSIfThenElse. I have no example at > hand, but remember two things about it: > * It feels strange to send then:else: to a JSObject. Not very > Smalltalkish. > * It does have a bug that I reported on this list a long time ago. It > only renders the (if) ? then : else; form. So you should change > #javascripContentOn: to > > javascriptContentOn: aStream > aStream nextPutAll: 'if('. > super javascriptContentOn: aStream. > aStream nextPutAll: ') {'. > aStream javascript: self trueStatement. > aStream nextPutAll: '} else {'. > aStream javascript: self falseStatement. > aStream nextPut: $}. > > for more complex statements. > > In your case, what you need to do first is produce a JSObject that > represents the results of the client-side check > "saveCancelButtonClicked == 1" and send it #then: or #then:else. I'd > be interested in how you can create that JSObject... I guess it's > easy.... > > Joachim > > > Am 10.04.13 14:59, schrieb [hidden email]: >> I posted this on Stack Overflow... no answer so far: >> How do I code a variable check into a Seaside jQuery onSuccess: script? >> I have an application with input fields that trigger a value change >> followed by a re-rendering of the view. It works nicely to provide >> lively feedback of domain data based on displayed values. >> The view shows 'Save' and 'Cancel' buttons if there are changes >> pending. If the user clicks on either button right after an input >> field, the onBlur: script of the input fields prevents the button >> action from taking place. The recommended solution (button click >> event lost due to the alert box in text box onblur event >> <http://stackoverflow.com/questions/3245350/button-click-event-lost-due-to-the-alert-box-in-text-box-onblur-event>) >> is to use the button's 'onmousedown' event to set a global variable >> that the onBlur script checks. >> With my test code I can see the global 'saveCancelButtonClicked' >> being set, but I don't know how to check the value in order to >> prevent the rendering step. >> |html button >> onMouseDown: 'saveCancelButtonClicked = 1;'; ... >> >> html textInput >> onBlur: (( >> html jQuery ajax >> callback: [:stringValue| self checkValue: stringValue] >> value: html jQuerythis value) >> onSuccess: ( >> (html jQuery id: 'selectedComponent') load html: >> [:renderer| renderer script: >> 'console.log(saveCancelButtonClicked);'. >> self renderSelectedComponentOn: renderer]) )]| >> I can see the console.log showing '1' if the save button is pressed. >> So how do I check the value and skip the 'self >> renderSelectedComponentOn:' step? >> It's easy enough to do in javascript (trivial if statement), but I >> have not found an example in Seaside. >> Thanks for any help, >> Bob Nemec >> >> >> _______________________________________________ >> 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 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Bob Nemec
|
|
|
Hi Bob,
I'm glad it worked and thanks for your feedback. There's always something new to learn in Seaside and its Javascript integration. Please remember my fix if you need to have more than one javascript statement executed (concatednated with a , on the Smalltalk side) in either the true or false branch. But maybe the fix isn't needed if you put those into a JavaScript block. I never tried and never had the idea before until right now as I type this. I don't even know if (a==b) ? {callA(); callB()} : {callC(); callD()}; is valid Javascript... ;-)) *headscratch* Joachim Excellent, it worked great... > > onSuccess: ( > (Javascript.JSStream on: 'saveCancelButtonClicked == 0') then: ( > (html jQuery id: 'portalSelectedComponent') load html: [:renderer | > > > ...the method that renders the save and cancel buttons contains... > html script: 'saveCancelButtonClicked = 0;' . > ...both the save and cancel buttons implement... > onMouseDown: 'saveCancelButtonClicked = 1;'; > > ...works just as I wanted: pressing either the 'Save' or 'Cancel' > button after updating an input field triggers the callback on the > first click. > And losing focus triggers the input field onBlur action normally. > > Thanks, > Bob > > > ------------------------------------------------------------------------ > *From:* "[hidden email]" <[hidden email]> > *To:* [hidden email] > *Sent:* Wednesday, April 10, 2013 9:21:52 AM > *Subject:* Re: [Seaside] jQuery variable check for onBlur > > Hi again, > > without having tested it, this may look something like > > onSuccess: ( > (JSStream on: 'saveCancelButtonClicked == 1') > then: ((html jQuery id: 'selectedComponent') load html: > [:renderer| self renderSelectedComponentOn: renderer])) > else: ....) > > Please let us know how the code ends up looking once you solved. I'd be > very interested to learn more about this. > > Joachim > > > Am 10.04.13 15:09, schrieb [hidden email] > <mailto:[hidden email]>: > > Hi Bob, > > > > I guess what you are looking for is JSIfThenElse. I have no example at > > hand, but remember two things about it: > > * It feels strange to send then:else: to a JSObject. Not very > > Smalltalkish. > > * It does have a bug that I reported on this list a long time ago. It > > only renders the (if) ? then : else; form. So you should change > > #javascripContentOn: to > > > > javascriptContentOn: aStream > > aStream nextPutAll: 'if('. > > super javascriptContentOn: aStream. > > aStream nextPutAll: ') {'. > > aStream javascript: self trueStatement. > > aStream nextPutAll: '} else {'. > > aStream javascript: self falseStatement. > > aStream nextPut: $}. > > > > for more complex statements. > > > > In your case, what you need to do first is produce a JSObject that > > represents the results of the client-side check > > "saveCancelButtonClicked == 1" and send it #then: or #then:else. I'd > > be interested in how you can create that JSObject... I guess it's > > easy.... > > > > Joachim > > > > > > Am 10.04.13 14:59, schrieb [hidden email] <mailto:[hidden email]>: > >> I posted this on Stack Overflow... no answer so far: > >> How do I code a variable check into a Seaside jQuery onSuccess: script? > >> I have an application with input fields that trigger a value change > >> followed by a re-rendering of the view. It works nicely to provide > >> lively feedback of domain data based on displayed values. > >> The view shows 'Save' and 'Cancel' buttons if there are changes > >> pending. If the user clicks on either button right after an input > >> field, the onBlur: script of the input fields prevents the button > >> action from taking place. The recommended solution (button click > >> event lost due to the alert box in text box onblur event > >> > <http://stackoverflow.com/questions/3245350/button-click-event-lost-due-to-the-alert-box-in-text-box-onblur-event>) > > >> is to use the button's 'onmousedown' event to set a global variable > >> that the onBlur script checks. > >> With my test code I can see the global 'saveCancelButtonClicked' > >> being set, but I don't know how to check the value in order to > >> prevent the rendering step. > >> |html button > >> onMouseDown: 'saveCancelButtonClicked = 1;'; ... > >> > >> html textInput > >> onBlur: (( > >> html jQuery ajax > >> callback: [:stringValue| self checkValue: stringValue] > >> value: html jQuerythis value) > >> onSuccess: ( > >> (html jQuery id: 'selectedComponent') load html: > >> [:renderer| renderer script: > >> 'console.log(saveCancelButtonClicked);'. > >> self renderSelectedComponentOn: renderer]) )]| > >> I can see the console.log showing '1' if the save button is pressed. > >> So how do I check the value and skip the 'self > >> renderSelectedComponentOn:' step? > >> It's easy enough to do in javascript (trivial if statement), but I > >> have not found an example in Seaside. > >> Thanks for any help, > >> Bob Nemec > >> > >> > >> _______________________________________________ > >> seaside mailing list > >> [hidden email] > <mailto:[hidden email]> > >> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside > > > > _______________________________________________ > > seaside mailing list > > [hidden email] > <mailto:[hidden email]> > > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside > > > > _______________________________________________ > seaside mailing list > [hidden email] > <mailto:[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 |
Re: jQuery variable check for onBlur
|
|
Hello all.
I guess that Seaside developers only wrap js construction that was needed to give support to another pieces of Seaside (like ajax, jQuery...), and they are not thinking in to give really support to construct complex js code in with Smalltalk objects. For that reason those js wrappers are incomplete and no correctly correlated to js language.
For example, for conditional statements exists only JSCondition that to evaluate only for true case, neither "If...else" nor "If...else if...else" (JSIfThenElse wrap the conditional operator not conditional statement).
Recently I made an Seaside app and often I had to make js sentences using "JSStream on:", no good :(. I've also seen other programmers code which did the same, in Reef IIRC. Maybe to use amber for that to be better...
Below some inline comments: 2013/4/10 [hidden email] <[hidden email]>
Yes it's really true! Please remember my fix if you need to have more than one javascript statement executed (concatednated with a , on the Smalltalk side) in either the true or false branch. In conditional operator, you have to use "," instead to ";" to separate sentences within brackets. Seaside to use an ";" to render js when concatenate sentences, so you have a problem here :(
is valid Javascript... ;-)) *headscratch* Regards. _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
|
|
Gaston,
Am 10.04.13 17:11, schrieb Gastón Dall' Oglio: > Hello all. > > I guess that Seaside developers only wrap js construction that was > needed to give support to another pieces of Seaside (like ajax, > jQuery...), and they are not thinking in to give really support to > construct complex js code in with Smalltalk objects. For that reason > those js wrappers are incomplete and no correctly correlated to js > language. Well, they are indeed incomplete, but cover quite some area. But I agree that sometimes the API to construct javascript statements feels strange. That is why I sometimes prefer to write a jQueryPlugin and integrate it with a subclass of JQPlugin on the Smalltalk side. Works quite well so far. > For example, for conditional statements exists only JSCondition that > to evaluate only for true case, neither "If...else" nor "If...else > if...else" (JSIfThenElse wrap the conditional operator not conditional > statement). Hmm. I wasn't aware of the differences between an if/then/else statement and the conditional statement. For me that was just the same thing with a shorter (and idiotic, but C-like) syntax. So the fix I suggest(ed) turns a JSIfThenElse form a conditional statement into an If..then...else statement. Not sure where there might be problems. Maybe if somebody uses JsIfThenElse on the right side of an assignment in JS. For my purposes, it does a good job. > > Recently I made an Seaside app and often I had to make js sentences > using "JSStream on:", no good :(. I've also seen other programmers > code which did the same, in Reef IIRC. Maybe to use amber for that to > be better... > > Below some inline comments: > > 2013/4/10 [hidden email] <mailto:[hidden email]> > <[hidden email] <mailto:[hidden email]>> > > > There's always something new to learn in Seaside and its > Javascript integration. > > > Yes it's really true! > > Please remember my fix if you need to have more than one > javascript statement executed (concatednated with a , on the > Smalltalk side) in either the true or false branch. > > But maybe the fix isn't needed if you put those into a JavaScript > block. I never tried and never had the idea before until right now > as I type this. > I don't even know if > > (a==b) ? {callA(); callB()} : {callC(); callD()}; > > > In conditional operator, you have to use "," instead to ";" to > separate sentences within brackets. Seaside to use an ";" to render js > when concatenate sentences, so you have a problem here :( statement and nobody has to worry about that (once again, very technical) difference. Or am I missing something? Joachim _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
Re: jQuery variable check for onBlur
|
|
Hello Joachim. I agree completly with all you say, just some remarks: * ?: is conditional *operator* and not conditional *statement* (sorry for this remark, but for clarification purpose it is important).
* you change to the JSIfThenElse class fix the problem to have conditional statement with a false part, but with this change there is no longer conditional operator (which is really useful to use in expressions). I think it would be better to add the factory methods missing to JSObject (like #conditional:else: and #conditional:elseif:), and the respective decorations classes if nedded.
Regards. 2013/4/10 [hidden email] <[hidden email]> Gaston, _______________________________________________ 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 |