Mike Stramba
2007-Aug-25 01:28 UTC
insert HTML <select> value into a textarea - Works in IE6, not in FireFox or Opera
I have a simple form at http://mstramba.com/fb5.html It''s just a <select> and a textarea. The idea is to be able to either type into a text area directly or choose from a list of saved words in the select box. When a new choice is made from the select, it automatically gets inserted into the text area. This code DOES work in I.E6 (on my machine (XP pro), but doesn''t work in Firefox 2.0.0.4 or Opera 9.0.2 With Firefox 2.0.04, when the page is first loaded, I can choose from the select control and it works until I type something in the text area, and then it stops working. (the <select> is not sending to the text area anymore) With Opera 9.02, the select control doesn''t work at all. 1) Does prototype do anything "internally" differently for whatever it''s equivalent of var txtNode=document.createTextNode(selectValue); var textArea=document.getElementById(targetTextArea); textArea.appendChild(txtNode); is ? 2) Should I be using some other way of accessing the textarea other than the "appendChild" method? Any other ideas appreciated. Mike ============================== http://snippets.dzone.com/posts/show/4465 ======This code DOES work in I.E6 (on my machine (XP pro), but doesn''t work in Firefox 1.5.0.12 or Opera 9.0.2 The idea is to be able to either type into a text area directly or choose from a list of saved words in the select box. When a new choice is made from the select, it automatically gets inserted into the text area. With Firefox 2.0.0.4, when the page is first loaded, I can choose from the select control and it works until I type something in the text area, and then it stops working. With Opera 9.02, the select control doesn''t work at all. IE6, works fine. // When the <select> is changed it should send the current select.value // to a given texarea (id=''content'' in this case) // The user can also just type directly into the textarea, the idea being that // the <select> gives access to a stored list of words. Actually the practical // use I''m trying to make of it is to hook it into the ''Instiki'' R.O.R. wiki // // With FireFox 2.0.04, this is working UNTIL something is manually typed into // the text area, then it stops working. // // It DOES work with IE6. // // It doesn''t work with Opera 9.0.2 // function SendSelectValueToTextArea(selectValue,targetTextArea) { var txtNode=document.createTextNode(selectValue); var textArea=document.getElementById(targetTextArea); textArea.appendChild(txtNode); } <select onchange="SendSelectValueToTextArea(this.value,''content'') --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Brian Williams
2007-Aug-25 01:57 UTC
Re: insert HTML <select> value into a textarea - Works in IE6, not in FireFox or Opera
why are you creating a textnode? just grab the text from the text area, append the new word and update the textarea? (just a guess actually I''ve never tried to do what you are doing... with prototype it might be as easy as<select onchange($(''target_textarea_id'').value = $(''target_textarea_id'').value + this.value) but i''m not a JS expert and I only started on pt this week.. On 8/24/07, Mike Stramba <mstramba-rieW9WUcm8FFJ04o6PK0Fg@public.gmane.org> wrote:> > > I have a simple form at http://mstramba.com/fb5.html > > It''s just a <select> and a textarea. > > The idea is to be able to either type into a text area directly or > choose from a list of saved words in the select box. When a new choice > is made from the select, it automatically gets inserted into the text > area. > > This code DOES work in I.E6 (on my machine (XP pro), but doesn''t work > in Firefox 2.0.0.4 or Opera 9.0.2 > > With Firefox 2.0.04, when the page is first loaded, I can choose from > the select control and it works until I type something in the text > area, and then it stops working. > (the <select> is not sending to the text area anymore) > > With Opera 9.02, the select control doesn''t work at all. > > 1) Does prototype do anything "internally" differently for whatever > it''s equivalent of > > var txtNode=document.createTextNode(selectValue); > var textArea=document.getElementById(targetTextArea); > textArea.appendChild(txtNode); > > is ? > > 2) Should I be using some other way of accessing the textarea other > than the "appendChild" method? > > Any other ideas appreciated. > > Mike > > > ============================== http://snippets.dzone.com/posts/show/4465 > ======> This code DOES work in I.E6 (on my machine (XP pro), but doesn''t work > in Firefox 1.5.0.12 or Opera 9.0.2 > > The idea is to be able to either type into a text area directly or > choose from a list of saved words in the select box. When a new choice > is made from the select, it automatically gets inserted into the text > area. > > With Firefox 2.0.0.4, when the page is first loaded, I can choose from > the select control and it works until I type something in the text > area, and then it stops working. > > With Opera 9.02, the select control doesn''t work at all. > > IE6, works fine. > > // When the <select> is changed it should send the current > select.value > // to a given texarea (id=''content'' in this case) > > // The user can also just type directly into the textarea, the idea > being that > // the <select> gives access to a stored list of words. Actually the > practical > // use I''m trying to make of it is to hook it into the ''Instiki'' > R.O.R. wiki > > // > // With FireFox 2.0.04, this is working UNTIL something is manually > typed into > // the text area, then it stops working. > // > > // It DOES work with IE6. > > // > // It doesn''t work with Opera 9.0.2 > // > > function SendSelectValueToTextArea(selectValue,targetTextArea) > { > var txtNode=document.createTextNode(selectValue); > var textArea=document.getElementById(targetTextArea); > textArea.appendChild(txtNode); > } > > <select onchange="SendSelectValueToTextArea(this.value,''content'') > > > > >--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
RobG
2007-Aug-25 02:25 UTC
Re: insert HTML <select> value into a textarea - Works in IE6, not in FireFox or Opera
Mike Stramba wrote:> I have a simple form at http://mstramba.com/fb5.html > > It''s just a <select> and a textarea. > > The idea is to be able to either type into a text area directly or > choose from a list of saved words in the select box. When a new choice > is made from the select, it automatically gets inserted into the text > area.Using onchange with a select element has usability issues - try using the keyboard to change selections in various browsers. Consider: <form action=""><div> <textarea id="ta"></textarea> <select onchange="this.form.ta.value=this[this.selectedIndex].text;"> <option selected> <option>bar <option>tin <option>can </select> <input type="reset"> <input type="submit"> </div></form>> This code DOES work in I.E6 (on my machine (XP pro), but doesn''t work > in Firefox 2.0.0.4 or Opera 9.0.2 > > With Firefox 2.0.04, when the page is first loaded, I can choose from > the select control and it works until I type something in the text > area, and then it stops working. > (the <select> is not sending to the text area anymore) > > With Opera 9.02, the select control doesn''t work at all. > > 1) Does prototype do anything "internally" differently for whatever > it''s equivalent of > > var txtNode=document.createTextNode(selectValue); > var textArea=document.getElementById(targetTextArea); > textArea.appendChild(txtNode);It is better to use textArea''s value attribute rather than append a text node.> > is ? > > 2) Should I be using some other way of accessing the textarea other > than the "appendChild" method?Yes, just get/set the textarea value. [...]> function SendSelectValueToTextArea(selectValue,targetTextArea) > { > var txtNode=document.createTextNode(selectValue); > var textArea=document.getElementById(targetTextArea); > textArea.appendChild(txtNode); > } > > <select onchange="SendSelectValueToTextArea(this.value,''content'')Not all browsers correctly report the value of a select element or even the value of the selected option. You need to explicitly get the value or text attribute of the selected option(s). None of the code you posted uses Prototype.js. -- Rob --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---