ie6 code

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

///////////////

<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>

to javascript firefox ie6 opera FillTextareafromSelect by mstram on Aug 24, 2007 1 Comments

Dom created - cant attach event

// description of your code here


function yearAdd(){
    $.log("add");
}


dayDel = function dayDel(t){
    $.log(this);
    $.log(t.target);
    $.log('del');
}


$(document).ready(function(){
    var b = $("<b class='del'>x</b>").click(dayDel);
    $("div.day").append(b);
//   b = $("<b class='add'>+</b>").click(yearAdd)
//    $("div.year center").append(b);
});

to javascript ie6 jquery by iogan18tm on Mar 25, 2007

Fix table width weirdness in IE6

If you have a table with rowspans and colspans, it's especially likely that IE6 will begin to ignore your width settings (even if they all add up to the right number) and create a monster table that spreads off into the distance. If your tables work perfectly in FF/Safari/etc, and in IE6 your content is positioned properly but the invisible elements of the table (visible only with borders on) extends to the side so that you get a horizontal scroll bar no matter what you do, you might want to try this drastic CSS tweak:

html {
    overflow-y: hidden;
}

If that doesn't work, try it in body:

body {
    overflow-y: hidden;
}

<disclaimer>Note that this is somewhat hackish, as a last resort if you *know* your tables are *fine* and IE6 is screwing up, and that overflow-x/y are IE6-only and not real CSS. </disclaimer>

to html css ie6 by ahoyhere on Apr 22, 2005

Search DZone Snippets

Popular @ dzone.com

Related Tags

Never been to DZone Snippets before?

JavaScript Fill Textarea from HTML Select not working with FireFox or Opera but does in IE6

Dom created - cant attach event

Fix table width weirdness in IE6