<html><body><div style="color:#000; background-color:#fff; font-family:arial, helvetica, sans-serif;font-size:10pt"><div><span>Paul,</span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span>Thanks for all the work. This is not something I would have figured out on my own.</span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span><br></span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span>In my example the list is now rendered after the first click and displayed on the second click, so from the user's point of view two clicks are needed to get the rendered list. That kind of makes sense, since the first click triggers the 'click' event
to build the selection list. Would there be a way to have the list displayed after build, rather than waiting for the second click?</span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span><br></span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span>Are you seeing the same click sequence? If not I'll go through my code more carefully.</span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span><br></span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span>I've tried the code first in VW 7.7.1 with Seaside 3.0 and again in the current Pharo
one-click image with Seaside 3.0.7</span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span><br></span></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span style="background-color: transparent;">Thanks again,</span><br></div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;">Bob</div><div style="color: rgb(0, 0, 0); font-size: 13px; font-family: arial, helvetica, sans-serif; background-color: transparent; font-style: normal;"><span><br></span></div><div><br></div> <div style="font-family: arial, helvetica, sans-serif; font-size: 10pt;"> <div style="font-family: 'times new roman', 'new york', times, serif; font-size: 12pt;"> <div dir="ltr"> <font size="2"
face="Arial"> <hr size="1"> <b><span style="font-weight:bold;">From:</span></b> Paul DeBruicker <pdebruic@gmail.com><br> <b><span style="font-weight: bold;">To:</span></b> bobn@rogers.com; Seaside - general discussion <seaside@lists.squeakfoundation.org> <br> <b><span style="font-weight: bold;">Sent:</span></b> Thursday, February 28, 2013 12:46:52 PM<br> <b><span style="font-weight: bold;">Subject:</span></b> Re: [Seaside] build drop-down select list when clicked<br> </font> </div> <br>I figured out the rest of it. The original callback from the select<br>doesn't do anything with the value from the expanded list. If you add a<br>hiddenInput after the select and serialize that with the selected value<br>of the select when the select changes, then things work nicely.<br><br>So change the renderSelect: method to<br><br>MyClass>>renderSelect:html<br> html select<br> id: html
lastId;<br> list: (Array with: self timeZone key);<br> script: (self loadSelectListOnceFor: html lastId on: html);<br> onChange: (self serializeHiddenInput: 'tzId' withValueFrom: html<br>lastId on: html);<br> selected: self timeZone key<br> <br> html hiddenInput<br> id: 'tzId';<br> callback: [ :val | self timeZone: (Timezone at: val) ].<br><br><br>and add<br><br>MyClass>>serializeHiddenInput: anId withValueFrom: selectId on: html<br> ^ ((html jQuery id: anId) value: ((html jQuery id: selectId) find:<br>'option:selected') contents text)<br> , (html jQuery ajax serialize: (html jQuery id: anId))<br><br><br><br><br>On
02/27/2013 09:24 PM, Paul DeBruicker wrote:<br>> I haven't figured out how to get the browser to recognize the changed<br>> value for the select, so the callback get the updated value if the user<br>> changes their choice. Probably need to clone the select after adding<br>> the options then replace the original with the new version. I'm not<br>> sure yet. But it would be handy to know. So it needs some work but<br>> what I outline below loads a bunch of <option> tags into the <select><br>> and serializes the select onChange: to the callback. Just not the value<br>> the user chooses yet.<br>> <br>> <br>> To load new select items into the select menu you need to create the<br>> <option> tags that comprise the select list and then stick them in there.<br>> <br>> Assuming your list is the Chronos list of Timezone keys you could do it<br>> like this:<br>> <br>>
MyClass>>renderSelect: html<br>> html select<br>> id: html lastId;<br>> list: (Array with: self timeZone key);<br>> script: (self loadSelectListOnce: html);<br>> onChange: html jQuery post serializeThis;<br>> selected: self timeZone key;<br>> callback: [ :val | self timeZone: (Timezone at: val) ].<br>> <br>> MyClass>>loadSelectListOnceFor: anId on: html<br>> ^ (html jQuery id: anId)<br>> one: 'click'<br>> do:<br>> (html jQuery ajax<br>>
html: [ :h | self renderTimeZoneList: h ]; <br>> onSuccess: (self loadOptionsInto: anId on: html))<br>> <br>> <br>> MyClass>>renderTimeZoneList:html<br>> Timezone allRegisteredKeys asSortedCollection<br>> doWithIndex: [ :eachTimeZone :index |<br>> html option<br>> value: index + 1;<br>> with: eachTimeZone ]<br>> <br>> MyClass>>loadOptionsInto: anId on: html<br>> ^ (JSStream<br>> on:'$("#' , anId ,' option:first").after(data)') asFunction: #('data'<br>> 'status'
'jqXhr')<br>> <br>> <br>> <br>> Good luck<br>> <br>> <br>> Paul<br>> <br>> <br>> <br>> On 02/27/2013 08:52 AM, <a ymailto="mailto:bobn@rogers.com" href="mailto:bobn@rogers.com">bobn@rogers.com</a> wrote:<br>>> Hello,<br>>> Is there a way to build the 'select' list when the drop-down button is<br>>> pressed?<br>>><br>>> Our application uses drop-down lists for options that have a short list<br>>> to pick from (longer lists use a lightbox list prompt).<br>>> In most cases, the list of values is not needed, since the user is not<br>>> going to change the selection. <br>>> So, I'd prefer to defer getting the list to when the user asks for it<br>>> (round trip time to get the list is less than 50ms).<br>>> Getting the data is not expensive, but including it in the initial data<br>>> retrieval for the full view is a coding hassle. <br>>><br>>>
I've tried various #onClick: code, like loading a new rendering of the<br>>> select component with the list populated, but no luck.<br>>><br>>> i.e.<br>>> html select<br>>> onClick: ("get the list and display it");<br>>> list: (Array with: initialSelection); "for initial display"<br>>> selected: initialSelection; <br>>> callback: [:value | ... ]<br>>> Thanks for any help,<br>>> Bob Nemec<br>>><br>>><br>>> _______________________________________________<br>>> seaside mailing list<br>>> <a ymailto="mailto:seaside@lists.squeakfoundation.org" href="mailto:seaside@lists.squeakfoundation.org">seaside@lists.squeakfoundation.org</a><br>>> <a href="http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside" target="_blank">http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside</a><br>>><br>> <br><br><br><br> </div> </div>
</div></body></html>