View Full Version : My InnerHTML and drop down script does not work with Firefox and Opera

09-26-2008, 11:20 PM
Hi all,

The following code works perfectly with IE but it doesn't work with Firefox and Opera. Do you have any idea about the possible reason ?


JavaScript Function part:

<script language="JavaScript" type="text/javascript">
function drawSelects(n){
var fields = document.forms["Cal"].elements;
if(n <= 3){
for(var i = 1; i <= 10; i++){
var newOpt = document.createElement("option");
newOpt.text = i;
newOpt.value = i;
fields["sel" + n].options.add(newOpt);
fields["sel" + n].onchange = function(){
drawInputs(this.options[this.selectedIndex].value, this.options[0].text);
setTimeout("drawSelects(" + n + ")",50);

function drawInputs(k, user){
document.getElementById(user).innerHTML = "";
for(var i = 0; i < k; i++){
var newInp = document.createElement("span");
newInp.innerHTML="<input type=text class=style2 name="+ user + (i+1) + " title='"+ user + (i+1) + "' / >";
document.getElementById(user).innerHTML += "&nbsp;&nbsp;&nbsp;<br />";

function clearForm(){
document.getElementById("newFields").innerHTML = "<div id=\"adults\"><\/div><div id=\"children\"><\/div><div id=\"infants\"><\/div>";

HTML Part:

<table align="center" width="100%" cellpadding="0" cellspacing="0" border="0">
<td height="44"><div align="left"><span class="style2">Other Adults:</span>
<select id="sel1" name="sel1" class="style2">
<option value="adults">Adults</option>
<td height="44"><div align="left"><span class="style2">Children(3-12): </span>
<select id="sel2" name="sel2" class="style2">
<option value="children">Children</option>
<td height="44"><div align="left"><span class="style2">Infants(0-2): </span>
<select id="sel3" name="sel3" class="style2">
<option value="infants">Infants</option>
<td colspan="3" valign="top">
<td valign="top" width="168"><div align="center" id="adults" runat="server" class="style2"></div> </td>
<td valign="top" width="168"><div align="center" id="children" runat="server" class="style2"></div></td>
<td valign="top" width="168"><div align="right" id="infants" runat="server" class="style2"></div></td>

09-27-2008, 08:46 AM
<div id=\"adults\"><\/div><div id=\"children\"><\/div><div id=\"infants\"><\/div> Why those \s ?
PS: innerHTML() is not a standard DOM method to create something; use createElement() instead.

09-27-2008, 11:38 AM
Thanks for the reply. I didn't write the code. I am not good at javascript. They helped me with writing this script on the Javascript forums. I don't have any idea how I can edit as you said.
Could you send me an example code?