JavaScript Fill Textarea from HTML Select not working with FireFox or Opera but does in IE6
//
// Fill textarea with keywords from HTML Select element
//
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
The idea is to be able to either type in the 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 , 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.
Any hints tips, appreciated, as I'm a novice with javascript / DOM programming.
I quite possibly am not using the most correct / efficient document.XXX calls here.
Mike
You can test it at http://mstramba.com/fb5.html
///////////////
// Fill textarea with keywords from HTML Select element
//
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
The idea is to be able to either type in the 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 , 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.
Any hints tips, appreciated, as I'm a novice with javascript / DOM programming.
I quite possibly am not using the most correct / efficient document.XXX calls here.
Mike
You can test it at http://mstramba.com/fb5.html
///////////////
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">textarea { height:200px; width:50%;}</style> <script type="text/javascript"> function htmlData(selectValue,targetTextArea) { // alert("select box changed to : '" + selectValue + "'"); var txtNode=document.createTextNode(selectValue); var textArea=document.getElementById(targetTextArea); textArea.appendChild(txtNode); } </script> </head> <body> <form method="post"> <select name="country" id="selbox" onchange="htmlData(this.value,'content')" /> <option value="#">-Select-</option> <option value="SuperCaliFragilisticExpiAliDocius">SuperCaliFragilisticExpiAliDocius</option> <option value="Discombombulatively">Discombombulatively</option> <option value="I don't understand how this can be happening">I don't understand how this can be happening</option> </select> <textarea name="content" id="content">Type some text or choose words from the select control</textarea> <input type="submit" /> </form> </body> </html>
