the following JavaScript:
<code> $('#external_links a').click(function() { return confirm('You are going to visit: ' + this.href); }); </code> The only elements receiving the onClick code are those divs that have anchors. I have generated code using Seaside as follows: 5 divs with id 'external_links' that contain anchors, and 5 additional divs also with id 'external_links' that just display text. The generated 'source' is: <code> <div id="external_links"> <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&6">1</a> </div> <div id="external_links"> <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&7">2</a> </div> <div id="external_links"> <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&8">3</a> </div> <div id="external_links"> <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&9">4</a> </div> <div id="external_links"> <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&10">5</a> </div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> </code> I don't know how to use Seaside to generate the javascript given above. I have tried adding a button with an onClick event containing 'html jQuery 'external_links a') click: [] - but I don't know what to say for the click: message. _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
Try something along these lines (I didn't test it):
((html jQuery: #external_links) has: 'a') would be confused if you executed it, because ids are unique ;) Instead, generate your elements with a class, then try: ((html jQuery: '.external_links') has: 'a') This will return all elements with the class "external_links" and then select from those, the ones that contain at least one anchor element. Also, you would want to generate the original elements with the click events already on them, unless you were to do something complicated, like check to see if the element being clicked meets your criteria. Alerts are not handled in Seaside, they are client side, so just evaluate a string :) Hope this helps, RS > To: [hidden email] > From: [hidden email] > Date: Fri, 4 Feb 2011 01:28:49 +0000 > Subject: [Seaside] I would like to attach an onClick event according to > > the following JavaScript: > <code> > $('#external_links a').click(function() { > return confirm('You are going to visit: ' + this.href); > }); > </code> > The only elements receiving the onClick code are those divs that have anchors. > > I have generated code using Seaside as follows: > 5 divs with id 'external_links' that contain anchors, and 5 additional divs also > with id 'external_links' that just display text. > The generated 'source' is: > <code> > <div id="external_links"> > <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&6">1</a> > </div> > <div id="external_links"> > <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&7">2</a> > </div> > <div id="external_links"> > <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&8">3</a> > </div> > <div id="external_links"> > <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&9">4</a> > </div> > <div id="external_links"> > <a href="/whatever?_s=5NvhIEVCuZvzZGEz&_k=7kFMmFlVjrpxySMO&10">5</a> > </div> > <div id="external_links">just some content</div> > <div id="external_links">just some content</div> > <div id="external_links">just some content</div> > <div id="external_links">just some content</div> > <div id="external_links">just some content</div> > </code> > I don't know how to use Seaside to generate the javascript given above. I have > tried adding a button with an onClick event containing 'html jQuery > 'external_links a') click: [] - but I don't know what to say for the click: > message. > > > _______________________________________________ > 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 |
Robert, thanks - what I am trying to do is translate the following article's
examples to Seaside. http://www.ibm.com/developerworks/library/x-ajaxjquery.html The first example works in javascript. And yes, this is contrived and I could generate the onClick events while rendering. _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
You'll just have to learn the packages. #onClick: is the method for binding click events.
In the example, they bind an alert function, so in Seaside it might look like this: ((html jQuery: #external_links) has: 'a') onClick: 'alert('Eeek!')'. Pop this onto a component... make sure you have the JQueryDeployment added to your libraries. <code> html div id: #external_link; style: 'height: 100px; width: 100px; background-color: red'; with: [ html anchor: 'blah' ]. html button bePush; onClick: (((html jQuery: #external_link) has: 'a') onClick: 'alert("Eeek!")'); with: 'Add click event'. </code> RS > To: [hidden email] > From: [hidden email] > Date: Fri, 4 Feb 2011 03:55:28 +0000 > Subject: [Seaside] Re: I would like to attach an onClick event according to > > Robert, thanks - what I am trying to do is translate the following article's > examples to Seaside. > http://www.ibm.com/developerworks/library/x-ajaxjquery.html > > The first example works in javascript. > > And yes, this is contrived and I could generate the onClick events while > rendering. > > > _______________________________________________ > 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 Robert Sirois
The example in JavaScript that works
http://jsbin.com/imuka5 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
You write that in Smalltalk rather easily.
This will help: book.seaside.st
RS > To: [hidden email] > From: [hidden email] > Date: Fri, 4 Feb 2011 04:34:25 +0000 > Subject: [Seaside] Re: I would like to attach an onClick event according to > > The example in JavaScript that works > http://jsbin.com/imuka5 > > _______________________________________________ > 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 Robert Sirois
Thanks Robert. I have not been able to make it work in Seaside; however, I make
it work readily with JavaScript as shown in http://jsbin.com/imuka5. This my code for the component in Seaside: <code> renderContentOn: html 1 to: 5 do: [:x | html div id: 'external_links'; with: [html anchor callback: [x inspect]; with: x]]. 1 to: 5 do: [:x | html div id: 'external_links'; with: 'just some content']. html button onClick: (html jQuery expression: '#external_links a') click(function(){return confirm(('You are going to visit: ' + this.href);)}) with: 'Attach Click' </code> But the part starting with click() does not work. _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
In reply to this post by Robert Sirois
Not yet able to write this in Seaside.
_______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
In reply to this post by Intrader Intrader
<code> 1 to: 5 do: [:x | html div class: 'external_links'; with: [ html anchor callback: [ x inspect ]; with: x ]. ]. 1 to: 5 do: [:x | html div id: 'external_links'; with: 'just some content' ]. html button onClick: (((html jQuery expression: '.external_links') has: 'a') onClick: 'confirm("You are going to visit: + this.href")'); with: 'Attach Click'. </code> RS > To: [hidden email] > From: [hidden email] > Date: Fri, 4 Feb 2011 04:46:09 +0000 > Subject: [Seaside] Re: I would like to attach an onClick event according to > > Thanks Robert. I have not been able to make it work in Seaside; however, I make > it work readily with JavaScript as shown in http://jsbin.com/imuka5. > > This my code for the component in Seaside: > <code> > renderContentOn: html > 1 to: 5 > do: [:x | html div id: 'external_links'; > with: [html anchor > callback: [x inspect]; > with: x]]. > 1 to: 5 > do: [:x | html div id: 'external_links'; with: 'just some > content']. > html button onClick: (html jQuery expression: '#external_links a') > click(function(){return confirm(('You are going to visit: ' + this.href);)}) > with: 'Attach Click' > </code> > But the part starting with click() does not work. > > _______________________________________________ > 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 |
Robert that really helped. I had the quotes wrong.
_______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
In reply to this post by Robert Sirois
Robert, even with the mess I made of the quotes, your code does not work.
I suspect that the way Seaside handles quote is incorrect (see the 'generated source' below). <your code> renderContentOn: html "From Robert Sirois with id corrections and at 'You are'..." 1 to: 5 do: [:x | html div id: 'external_links'; with: [ html anchor callback: [ x inspect ]; with: x ]. ]. 1 to: 5 do: [:x | html div id: 'external_links'; with: 'just some content' ]. html button onClick: ((html jQuery expression: '#external_links a') onClick: 'return confirm("You are going to visit: "+ this.href)'); with: 'Attach Click'. </your code> <generated source> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&6">1</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&7">2</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&8">3</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&9">4</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&10">5</a> </div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <button onclick="$("#external_links a").click(function(){return confirm("You are going to visit: "+ this.href)})" type="submit" class="submit">Attach Click</button> </generated source> Note the strange way that it has translate quotes - the JavaScript interpreter (or compiler) has trouble with the double quotes The correct code in JavaScript is in http://jsbin.com/imuka5/2 The code I want from the IBM article has the following expression: <code> $('#external_links a').click(function() { return confirm('You are going to visit: ' + this.href); }); </code> _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
renderContentOn: html
| onclick | onclick := html javascript return: ((Javascript.JSStream new) nextPutAll: 'confirm'; argument: (html jQuery this attributeAt: 'href')). "Install on all anchors within a div" (html div) id: #external_links; script: ((html jQuery this) find: 'a'; onClick: onclick); with: [(html anchor) url: 'http://google.com'; with: 'Google']. "Install on all anchors with rel=external" html div with: [(html anchor) relationship: 'external'; url: 'http://yahoo.com'; with: 'Yahoo']. html document addLoadScript: ((html jQuery: 'a[rel="external"]') onClick: onclick) -----Original Message----- From: [hidden email] [mailto:[hidden email]] On Behalf Of Fritz Schenk Sent: Friday, February 04, 2011 12:42 PM To: [hidden email] Subject: [Seaside] Re: I would like to attach an onClick event according to Robert, even with the mess I made of the quotes, your code does not work. I suspect that the way Seaside handles quote is incorrect (see the 'generated source' below). <your code> renderContentOn: html "From Robert Sirois with id corrections and at 'You are'..." 1 to: 5 do: [:x | html div id: 'external_links'; with: [ html anchor callback: [ x inspect ]; with: x ]. ]. 1 to: 5 do: [:x | html div id: 'external_links'; with: 'just some content' ]. html button onClick: ((html jQuery expression: '#external_links a') onClick: 'return confirm("You are going to visit: "+ this.href)'); with: 'Attach Click'. </your code> <generated source> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&6">1</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&7">2</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&8">3</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&9">4</a> </div> <div id="external_links"> <a href="/whatever?_s=LG3lfxc-9JRlLsd5&_k=IrWB5OCYShO7CscD&10">5</a> </div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <div id="external_links">just some content</div> <button onclick="$("#external_links a").click(function(){return confirm("You are going to visit: "+ this.href)})" type="submit" class="submit">Attach Click</button> </generated source> Note the strange way that it has translate quotes - the JavaScript interpreter (or compiler) has trouble with the double quotes The correct code in JavaScript is in http://jsbin.com/imuka5/2 The code I want from the IBM article has the following expression: <code> $('#external_links a').click(function() { return confirm('You are going to visit: ' + this.href); }); </code> _______________________________________________ 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 |
Thank you Boris
Most informative of other ways to do things. In my case, I want to translate <code> $('#external_links a').click(function() { return confirm('You are going to visit: ' + this.href); }); </code> The problem I find is that Seaside incorrectly translates <code> html button onClick: ((html jQuery expression: '#external_links a') onClick: 'return confirm("You are going to visit: "+ this.href)'); with: 'Attach Click'. </code> It has trouble with quotes as it translates the above into: <bad code> <button onclick="$("#external_links a").click(function(){return confirm("You are going to visit: "+ this.href)})" type="submit" class="submit">Attach Click</button> </bad code> As you see the quotes, they are incorrect. How do I correct this? Thanks again _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
In string literals, single quotes are escaped by a preceding single quote.
What you should do is search for some Smalltalk examples and Seaside tutorials. I believe there are other mailing lists for Smalltalk. RS > To: seaside@lists.squeakfoundation.org > From: intrader.intrader@gmail.com > Date: Fri, 4 Feb 2011 19:48:32 +0000 > Subject: [Seaside] Re: I would like to attach an onClick event according to > > Thank you Boris > > Most informative of other ways to do things. > > In my case, I want to translate > <code> > $('#external_links a').click(function() { > return confirm('You are going to visit: ' + this.href); > }); > </code> > > The problem I find is that Seaside incorrectly translates > > <code> > html button > onClick: ((html jQuery expression: '#external_links a') onClick: 'return > confirm("You are going to visit: "+ this.href)'); > with: 'Attach Click'. > </code> > > It has trouble with quotes as it translates the above into: > <bad code> > <button onclick="$("#external_links a").click(function(){return confirm("You are > going to visit: "+ this.href)})" type="submit" class="submit">Attach > Click</button> > </bad code> > As you see the quotes, they are incorrect. How do I correct this? > > Thanks again > > _______________________________________________ > seaside mailing list > seaside@lists.squeakfoundation.org > 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 Intrader Intrader
Have a look at JSStream for a way to include literal JavaScript. Having
said all that, in any serious project where you write custom JavaScript, you're going to want to have a file served from your library that includes all of your code and you can use vim/emacs/whatever to edit it to your liking. -Boris -----Original Message----- From: [hidden email] [mailto:[hidden email]] On Behalf Of Fritz Schenk Sent: Friday, February 04, 2011 2:49 PM To: [hidden email] Subject: [Seaside] Re: I would like to attach an onClick event according to Thank you Boris Most informative of other ways to do things. In my case, I want to translate <code> $('#external_links a').click(function() { return confirm('You are going to visit: ' + this.href); }); </code> The problem I find is that Seaside incorrectly translates <code> html button onClick: ((html jQuery expression: '#external_links a') onClick: 'return confirm("You are going to visit: "+ this.href)'); with: 'Attach Click'. </code> It has trouble with quotes as it translates the above into: <bad code> <button onclick="$("#external_links a").click(function(){return confirm("You are going to visit: "+ this.href)})" type="submit" class="submit">Attach Click</button> </bad code> As you see the quotes, they are incorrect. How do I correct this? Thanks again _______________________________________________ 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 Robert Sirois
Thanks Robert
I understand what it does - however it does it incorrectly. The Seaside onClick handler surrounds the text in double quotes, which invalidates the single quotes in <snippet>expression:'external_links a'</snippet> <bad code> <button onclick="$("#external_links a").click(function(){return confirm("You are going to visit: "+ this.href)})" type="submit" class="submit">Attach Click</button> </bad code> My question is how to use Seaside to express the IBM example's code in the most direct and DRY way. _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
In reply to this post by Boris Popov, DeepCove Labs (SNN)
Thanks Boris. The code for you provided
<bad code does not compile> | onclick | onclick := html javascript return: ((Javascript.JSStream new) nextPutAll: 'confirm'; argument: (html jQuery </bad code does not compile> To my thinking we should strive to say it Seaside. In this case, Seaside does handle the desired text correctly when handling <desired Seaside> html button onClick: ((html jQuery expression: '#external_links a') onClick: 'return confirm("You are going to visit: "+ this.href)'); with: 'Attach Click'. </desired Seaside> <desired result in javascript> <button onClick="$('#external_links a').click(function() { return confirm('You are going to visit: ' + this.href); });" type="submit" class="submit">Attach Click</button> </desired result in javascript> and the jsbin: http://jsbin.com/imuka5/2 _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
You may need to remove namespace declaration if you're not on
VisualWorks. -----Original Message----- From: [hidden email] [mailto:[hidden email]] On Behalf Of Fritz Schenk Sent: Friday, February 04, 2011 3:14 PM To: [hidden email] Subject: [Seaside] Re: I would like to attach an onClick event according to Thanks Boris. The code for you provided <bad code does not compile> | onclick | onclick := html javascript return: ((Javascript.JSStream new) nextPutAll: 'confirm'; argument: (html jQuery </bad code does not compile> To my thinking we should strive to say it Seaside. In this case, Seaside does handle the desired text correctly when handling <desired Seaside> html button onClick: ((html jQuery expression: '#external_links a') onClick: 'return confirm("You are going to visit: "+ this.href)'); with: 'Attach Click'. </desired Seaside> <desired result in javascript> <button onClick="$('#external_links a').click(function() { return confirm('You are going to visit: ' + this.href); });" type="submit" class="submit">Attach Click</button> </desired result in javascript> and the jsbin: http://jsbin.com/imuka5/2 _______________________________________________ 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 Intrader Intrader
My understanding is that javascript doesn't differentiate between double and single quotes.
Either pass a string in as the event (generated or static from the server), or simply import your code into the head of the page. Seaside provides a great way to generate javascript, as per Boris' responses. I personally use the jQuery classes almost exclusively so I don't have to look at raw javascript often. Without further examination (I'm on my phone), you'll have to allow someone else to help you right now. RS > To: seaside@lists.squeakfoundation.org > From: intrader.intrader@gmail.com > Date: Fri, 4 Feb 2011 20:05:36 +0000 > Subject: [Seaside] Re: I would like to attach an onClick event according to > > Thanks Robert > I understand what it does - however it does it incorrectly. The Seaside onClick > handler surrounds the text in double quotes, which invalidates the single quotes > in <snippet>expression:'external_links a'</snippet> > <bad code> > <button onclick="$("#external_links a").click(function(){return confirm("You are > going to visit: "+ this.href)})" type="submit" class="submit">Attach > Click</button> > </bad code> > My question is how to use Seaside to express the IBM example's code in the most > direct and DRY way. > > > > _______________________________________________ > seaside mailing list > seaside@lists.squeakfoundation.org > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
JavaScript expects proper nesting of quotes. Double quotes can't be nested in
double quotes. If you need to do that you must use "\""", but in this case we can't _______________________________________________ seaside mailing list [hidden email] http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside |
Free forum by Nabble | Edit this page |