Thanks for your tips.

Based on your tips, I have to do it a bit differently as my select list is built from symbols (#mister, #miss #misses) and Seaside in that case, only store index number in the option list value attribute:

<option value="1">Madame</option> <option value="2" selected="selected">Mademoiselle</option> <option value="3">Monsieur</option>

Therefore the (JSStream on: 'options[selectedIndex].text') sent to the ajax callback these index number (1 2 or 3) and not my symbol.

However I discover the 'html jQuery ajax serialize:' does two things: send the jqueried input field value to the server and fire its Seaside callback, where my symbol are known.

(field := mold at: #civility) onChange: [ :aHtml | html jQuery ajax serialize: html jQuery this; script: [ :s | field input == #missis ifTrue: [s << (s jQuery: #maiden) show] ifFalse: [s << (s jQuery: #maiden) hide]]

Now it seems to work locally, but stuff is uncoupled and asynchrone: do I have the risk the script is fired before the serialize is terminated?

Thanks

Hilaire

Le 27/04/2015 00:57, Bob Arning a écrit :

This works for me:

Hi Hilaire,

I wonder: do you really need the value server-side? If you just want to manipulate the DOM but not send any value server-side, I would do it like this:

(field := mold at: #civility) onChange: (html jQuery this value) equals: ‘missis’ asJavascript then: (html jQuery: #maiden) show then: (html jQuery: #maiden) hide)

This will avoid doing a server-side call and has the advantage of immediate updating on your webbrowser without the delay of a server round-trip.

Also, in this case, the generation of the javascript is small and readable, but for such ‘static’ javascript, it’s better to put them in a separate file and only call the necessary function from your Seaside code. For example:

(field := mold at: #civility) onChange: (html javascript call: ‘maidenToggle’ with: (html jQuery this))

cheers, Johan

On 27 Apr 2015, at 10:50, Hilaire hilaire@drgeo.eu wrote:

Thanks for your tips.

Based on your tips, I have to do it a bit differently as my select list is built from symbols (#mister, #miss #misses) and Seaside in that case, only store index number in the option list value attribute:

     <option value="1">Madame</option>
     <option value="2" selected="selected">Mademoiselle</option>
     <option value="3">Monsieur</option>

Therefore the (JSStream on: 'options[selectedIndex].text') sent to the ajax callback these index number (1 2 or 3) and not my symbol.

However I discover the 'html jQuery ajax serialize:' does two things: send the jqueried input field value to the server and fire its Seaside callback, where my symbol are known.

(field := mold at: #civility) onChange: [ :aHtml | html jQuery ajax serialize: html jQuery this; script: [ :s | field input == #missis ifTrue: [s << (s jQuery: #maiden) show] ifFalse: [s << (s jQuery: #maiden) hide]]

Now it seems to work locally, but stuff is uncoupled and asynchrone: do I have the risk the script is fired before the serialize is terminated?

Thanks

Hilaire

Le 27/04/2015 00:57, Bob Arning a écrit :

...

This works for me:

-- Dr. Geo - http://drgeo.eu iStoa - http://istoa.drgeo.eu

---

seaside mailing list seaside@lists.squeakfoundation.org http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

On 29 Apr 2015, at 14:23, Hilaire hilaire@drgeo.eu wrote:

Le 28/04/2015 09:21, Johan Brichau a écrit :

...

onChange: (html jQuery this value) equals: ‘missis’ asJavascript then: (html jQuery: #maiden) show then: (html jQuery: #maiden) hide)

I understand the intend but not the syntax. I can see #then:else: message but no #equals: jquery instance But I am curious to learn how to

You’re right. JSObject>>equals: is an extension that is not in the standard Seaside package. I’ll add it, but in the meantime, here’s the implementation:

JSObject>>equals: anObject "Combine the receiver and anObject with a logical AND." self addDecoration: (JSBinary new operator: '=='; statement: anObject)

Generating pieces of Javascript code is only appropriate when they _need_ to be generated. For example, when you need to generate a Seaside-JQuery callback inside a javascript, only Seaside can generate the right url for the callback and injecting it into a piece of Javascript code is easily done with Seaside’s Javascript-generation logic.

html button bePush; onClick: (html jQuery ajax callback:[ self iWasClicked ]); with: ‘Click me!'

Seaside allows you to generate Javascript code, just like it allows you to generate html, but that should not tempt you to generate anything more than what needs to be generated. There is a conceptual difference between generating html (which is a declarative output) and Javascript code (which is procedural output), that makes it harder to understand. However, generating simple things around callbacks can be easy:

html button bePush; onClick: (html jQuery this) hide, (html jQuery ajax callback:[ self iWasClicked ]),(html jQuery this) show, html javascript return: false; with: ‘Click me!'

If you need pieces of javascript code that can be hand-written, then just write them down in a separate file and include it on the page.

updateRoot: super updateRoot: aRoot. aRoot javascript resourceUrl: ‘myapp.js’

If that is too much for what you want to do, there is always JSStream:

html button bePush; onClick: (JSStream on: ‘$(“#foobar”).html(“Someone clicked me”); return false;'); with: ‘Click me!’

cheers Johan

ps: The examples above are just to demonstrate code options, they do not show any useful interaction.

On 02 May 2015, at 11:46, Hilaire hilaire@drgeo.eu wrote:

Ok. This way of definining Javascript snippet code is very Smalltalkish :)

I am wondering what is the pros and cons compared to just pure javascript code integrated in a page as we do it for css descriptions. Easier to debug? To protoype? But slower? Anyway both options are there so it is nice.

Hilaire

Le 01/05/2015 14:11, Johan Brichau a écrit :

...

You’re right. JSObject>>equals: is an extension that is not in the standard Seaside package. I’ll add it, but in the meantime, here’s the implementation:

JSObject>>equals: anObject "Combine the receiver and anObject with a logical AND."

self addDecoration: (JSBinary new operator: '=='; statement: anObject)

-- Dr. Geo - http://drgeo.eu iStoa - http://istoa.drgeo.eu

---

seaside mailing list seaside@lists.squeakfoundation.org http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside