Re: [Proto-Scripty] how-to add option to select
I would say first retrieve all the options into an array and then push the one one you want into the array there after push all of the array items into the select again as a dynamic select object Regards, Bongani T Mabunda... Thanks -Original Message- From: Phil Petree phil.pet...@gmail.com Sender: prototype-scriptaculous@googlegroups.com Date: Tue, 7 Jun 2011 16:09:03 To: prototype-scriptaculous@googlegroups.com Reply-To: prototype-scriptaculous@googlegroups.com Subject: [Proto-Scripty] how-to add option to select I've tried every option that I can find or figure out to add an option to a select using prototype or dom. What I have figured out is that when prototype 1.6.x is present normal dom functions dont SEEM work! ??? So how do you add an option to a select in prototype? ??? I have: var value = New York; // json.options[i].value var display = New York; // json.options[i].text I have tried: $('city').options[i] = new Option(json.options[i].text, json.options[i].value, null,(selsel==json.options[i].value?true:false)); $('city').add = new Option(display, value); addOption('city', value, display); addOption('city', New York, New York); select.insert(new Element('option', {value: value}).update('city')); // and about a dozen other options // this function works if called from the form with onclick=addOption('city', 'New York', 'New York') // but if called from the onSuccess function and being passed the data (or even hard coded) I get nothing! function addOption(selectID, value, display) { var myselect = document.getElementById(selectID); try { myselect.add(new Option(display, value), null); //add new option to end of selectID } catch(e) { //in IE, try the below version instead of add() myselect.add(new Option(display, value)); //add new option to end of selectID } } -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
I have it working... demo here: http://www.philpetree.com/json/ Where are ya'll posting the demo code? On Tue, Jun 7, 2011 at 4:45 PM, Bongani T Mabunda mabund...@gmail.comwrote: I would say first retrieve all the options into an array and then push the one one you want into the array there after push all of the array items into the select again as a dynamic select object Regards, Bongani T Mabunda... Thanks -- *From: * Phil Petree phil.pet...@gmail.com *Sender: * prototype-scriptaculous@googlegroups.com *Date: *Tue, 7 Jun 2011 16:09:03 -0400 *To: *prototype-scriptaculous@googlegroups.com *ReplyTo: * prototype-scriptaculous@googlegroups.com *Subject: *[Proto-Scripty] how-to add option to select I've tried every option that I can find or figure out to add an option to a select using prototype or dom. What I have figured out is that when prototype 1.6.x is present normal dom functions dont SEEM work! ??? So how do you add an option to a select in prototype? ??? I have: var value = New York; // json.options[i].value var display = New York; // json.options[i].text I have tried: $('city').options[i] = new Option(json.options[i].text, json.options[i].value, null,(selsel==json.options[i].value?true:false)); $('city').add = new Option(display, value); addOption('city', value, display); addOption('city', New York, New York); select.insert(new Element('option', {value: value}).update('city')); // and about a dozen other options // this function works if called from the form with onclick=addOption('city', 'New York', 'New York') // but if called from the onSuccess function and being passed the data (or even hard coded) I get nothing! function addOption(selectID, value, display) { var myselect = document.getElementById(selectID); try { myselect.add(new Option(display, value), null); //add new option to end of selectID } catch(e) { //in IE, try the below version instead of add() myselect.add(new Option(display, value)); //add new option to end of selectID } } -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
JSbin is a popular way to show working examples. Gives you a persistent URL and you can edit it and demo it right in the browser. Walter On Jun 8, 2011, at 3:19 PM, Phil Petree wrote: Where are ya'll posting the demo code? -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
I looked at jsbin earlier and have actually tested some snippets there... however you can't (to my knowledge) upload your php code there. I wanted to stick all the source modules up. On Wed, Jun 8, 2011 at 3:28 PM, Walter Davis wa...@wdstudio.com wrote: JSbin is a popular way to show working examples. Gives you a persistent URL and you can edit it and demo it right in the browser. Walter On Jun 8, 2011, at 3:19 PM, Phil Petree wrote: Where are ya'll posting the demo code? -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
That's true, that's generally not available as far as I know. That's why you put up a scratch server somewhere, and then you can upload and test whatever you want. But JSbin is excellent for making stand-alone test pages, since you are forced to put everything in one page, and you tend to simplify to the point where you smack your forehead and say never mind to the mailing list. Walter On Jun 8, 2011, at 3:49 PM, Phil Petree wrote: I looked at jsbin earlier and have actually tested some snippets there... however you can't (to my knowledge) upload your php code there. I wanted to stick all the source modules up. On Wed, Jun 8, 2011 at 3:28 PM, Walter Davis wa...@wdstudio.com wrote: JSbin is a popular way to show working examples. Gives you a persistent URL and you can edit it and demo it right in the browser. Walter On Jun 8, 2011, at 3:19 PM, Phil Petree wrote: Where are ya'll posting the demo code? -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
I have spare servers out the ying-yang... not a problem there... ever met one of those people that no matter how hard you try you just cant seem to understand them when there are similar people that you get from minute one? that's me and prototype! LOL I stuck .zip/.rar files on the demo page and people can download it from there. http:/www.philpetree.com/json This has the html, .js and php files and is fully functioning. On Wed, Jun 8, 2011 at 5:12 PM, Walter Davis wa...@wdstudio.com wrote: That's true, that's generally not available as far as I know. That's why you put up a scratch server somewhere, and then you can upload and test whatever you want. But JSbin is excellent for making stand-alone test pages, since you are forced to put everything in one page, and you tend to simplify to the point where you smack your forehead and say never mind to the mailing list. Walter On Jun 8, 2011, at 3:49 PM, Phil Petree wrote: I looked at jsbin earlier and have actually tested some snippets there... however you can't (to my knowledge) upload your php code there. I wanted to stick all the source modules up. On Wed, Jun 8, 2011 at 3:28 PM, Walter Davis wa...@wdstudio.com wrote: JSbin is a popular way to show working examples. Gives you a persistent URL and you can edit it and demo it right in the browser. Walter On Jun 8, 2011, at 3:19 PM, Phil Petree wrote: Where are ya'll posting the demo code? -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
Your function is using add() to add an option to the end of the select, but I have never seen that work completely myself. Best to stick with the long-hand methods, they are at least known to work in most browsers: menu = $('mySelectList'); menu.options[menu.options.length] = new Option('Label','value'); Walter On Jun 7, 2011, at 4:09 PM, Phil Petree wrote: I've tried every option that I can find or figure out to add an option to a select using prototype or dom. What I have figured out is that when prototype 1.6.x is present normal dom functions dont SEEM work! ??? So how do you add an option to a select in prototype? ??? I have: var value = New York; // json.options[i].value var display = New York; // json.options[i].text I have tried: $('city').options[i] = new Option(json.options[i].text, json.options[i].value, null,(selsel==json.options[i].value? true:false)); $('city').add = new Option(display, value); addOption('city', value, display); addOption('city', New York, New York); select.insert(new Element('option', {value: value}).update('city')); // and about a dozen other options // this function works if called from the form with onclick=addOption('city', 'New York', 'New York') // but if called from the onSuccess function and being passed the data (or even hard coded) I get nothing! function addOption(selectID, value, display) { var myselect = document.getElementById(selectID); try { myselect.add(new Option(display, value), null); //add new option to end of selectID } catch(e) { //in IE, try the below version instead of add() myselect.add(new Option(display, value)); //add new option to end of selectID } } -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
thanks Walter... bottom line is that addOption works fine if called directly but only clears the select if called from the Ajax.updater onSuccess... even using static data! This works: select id='county' name='county' onclick=addOption('city', 'New Boca','New Boca')/selectbr/ This doesn't (button is clicked (onclick=cities()): function cities() { if($F('zip').length == 5) { var options = { method: 'get', parameters: 'zip='+escape($F('zip')), onSuccess: city_fill, onFailure: ajax_fail, on0: ajax_fail}; var myAjax = new Ajax.Updater('city', 'cities.php', options); } } function city_fill(transport, json) { var szSelectID = 'city'; var json = transport.responseText.evalJSON(true); // length = 7 for the zip I am testing with for( var i=0; ijson.options.length; i++) { var szValue = json.options[i].value; var szDisplay = json.options[i].text; addOption('city', 'New York', 'New York'); } } On Tue, Jun 7, 2011 at 5:08 PM, Walter Davis wa...@wdstudio.com wrote: Your function is using add() to add an option to the end of the select, but I have never seen that work completely myself. Best to stick with the long-hand methods, they are at least known to work in most browsers: menu = $('mySelectList'); menu.options[menu.options.length] = new Option('Label','value'); Walter On Jun 7, 2011, at 4:09 PM, Phil Petree wrote: I've tried every option that I can find or figure out to add an option to a select using prototype or dom. What I have figured out is that when prototype 1.6.x is present normal dom functions dont SEEM work! ??? So how do you add an option to a select in prototype? ??? I have: var value = New York; // json.options[i].value var display = New York; // json.options[i].text I have tried: $('city').options[i] = new Option(json.options[i].text, json.options[i].value, null,(selsel==json.options[i].value?true:false)); $('city').add = new Option(display, value); addOption('city', value, display); addOption('city', New York, New York); select.insert(new Element('option', {value: value}).update('city')); // and about a dozen other options // this function works if called from the form with onclick=addOption('city', 'New York', 'New York') // but if called from the onSuccess function and being passed the data (or even hard coded) I get nothing! function addOption(selectID, value, display) { var myselect = document.getElementById(selectID); try { myselect.add(new Option(display, value), null); //add new option to end of selectID } catch(e) { //in IE, try the below version instead of add() myselect.add(new Option(display, value)); //add new option to end of selectID } } -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
try using Ajax.Request -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To view this discussion on the web visit https://groups.google.com/d/msg/prototype-scriptaculous/-/QTllMU5xRkRZMllK. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
Try doing this inside an Ajax.Request, not an Updater. You can still update things, but you do it yourself, and I think you might not get these problems. My guess is that you are trying to update a picker that has been swapped out beneath you. If it works in a click, it will work in an Ajax.Request callback. Walter On Jun 7, 2011, at 5:23 PM, Phil Petree wrote: thanks Walter... bottom line is that addOption works fine if called directly but only clears the select if called from the Ajax.updater onSuccess... even using static data! This works: select id='county' name='county' onclick=addOption('city', 'New Boca','New Boca')/selectbr/ This doesn't (button is clicked (onclick=cities()): function cities() { if($F('zip').length == 5) { var options = { method: 'get', parameters: 'zip='+escape($F('zip')), onSuccess: city_fill, onFailure: ajax_fail, on0: ajax_fail}; var myAjax = new Ajax.Updater('city', 'cities.php', options); } } function city_fill(transport, json) { var szSelectID = 'city'; var json = transport.responseText.evalJSON(true); // length = 7 for the zip I am testing with for( var i=0; ijson.options.length; i++) { var szValue = json.options[i].value; var szDisplay = json.options[i].text; addOption('city', 'New York', 'New York'); } } On Tue, Jun 7, 2011 at 5:08 PM, Walter Davis wa...@wdstudio.com wrote: Your function is using add() to add an option to the end of the select, but I have never seen that work completely myself. Best to stick with the long-hand methods, they are at least known to work in most browsers: menu = $('mySelectList'); menu.options[menu.options.length] = new Option('Label','value'); Walter On Jun 7, 2011, at 4:09 PM, Phil Petree wrote: I've tried every option that I can find or figure out to add an option to a select using prototype or dom. What I have figured out is that when prototype 1.6.x is present normal dom functions dont SEEM work! ??? So how do you add an option to a select in prototype? ??? I have: var value = New York; // json.options[i].value var display = New York; // json.options[i].text I have tried: $('city').options[i] = new Option(json.options[i].text, json.options[i].value, null,(selsel==json.options[i].value? true:false)); $('city').add = new Option(display, value); addOption('city', value, display); addOption('city', New York, New York); select.insert(new Element('option', {value: value}).update('city')); // and about a dozen other options // this function works if called from the form with onclick=addOption('city', 'New York', 'New York') // but if called from the onSuccess function and being passed the data (or even hard coded) I get nothing! function addOption(selectID, value, display) { var myselect = document.getElementById(selectID); try { myselect.add(new Option(display, value), null); //add new option to end of selectID } catch(e) { //in IE, try the below version instead of add() myselect.add(new Option(display, value)); //add new option to end of selectID } } -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
Matt Walter, You are both right... Ajax.Updater is, apparently, trying to update the select AFTER it calls onSuccess and since it is incapable of updating a select it was thereby overwritting my adds... no problem, once I figured that out, I just added in a div id='results' and let the updater put the json there... it makes it easy to debug and I can update it once I get this fully working (or leave it in the example I plan on posting somewhere so the next person doesn't have to go through all this). Next two things are: 1) clear the selects. $('city').clear() doesnt work nor does $('city).options.length = 0; Any suggestions on how to go about that? 2) get the event observers to work... neither $('zip').observe('onkeyup', cities); OR Event.Observe('zip', 'onkeyup', counties); works On Tue, Jun 7, 2011 at 5:41 PM, Matt Petrovic cyberbr...@gmail.com wrote: try using Ajax.Request -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To view this discussion on the web visit https://groups.google.com/d/msg/prototype-scriptaculous/-/QTllMU5xRkRZMllK . To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] how-to add option to select
On Jun 7, 2011, at 9:00 PM, Phil Petree wrote: Matt Walter, You are both right... Ajax.Updater is, apparently, trying to update the select AFTER it calls onSuccess and since it is incapable of updating a select it was thereby overwritting my adds... no problem, once I figured that out, I just added in a div id='results' and let the updater put the json there... it makes it easy to debug and I can update it once I get this fully working (or leave it in the example I plan on posting somewhere so the next person doesn't have to go through all this). Next two things are: 1) clear the selects. $('city').clear() doesnt work nor does $ ('city).options.length = 0; Any suggestions on how to go about that? I always set theSelect.options.length = 0 and that works for me. Can you post a self-contained failing example so I can try it? 2) get the event observers to work... neither $ ('zip').observe('onkeyup', cities); OR Event.Observe('zip', 'onkeyup', counties); works In Event.Observe or the Element.observe convenience method, you drop the on part of the event name. So you would put $ ('zip').observe('keyup',doSomethingWild); Glad you're back on track! Walter On Tue, Jun 7, 2011 at 5:41 PM, Matt Petrovic cyberbr...@gmail.com wrote: try using Ajax.Request -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To view this discussion on the web visit https://groups.google.com/d/msg/prototype-scriptaculous/-/QTllMU5xRkRZMllK . To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com . To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com . For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en . -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.