?? help me ?? what wrong in this script

[noztox]

you can help me ?

<script language="JavaScript">
var counter = 0;

function moreFields()
{
	counter++;
	var newFields = document.getElementById('readroot').cloneNode(true);
	newFields.id = '';
	newFields.style.display = 'block';
	var newField = newFields.childNodes;
	for (var i=0;i<newField.length;i++)
	{
		var theName = newField[i].name
		if (theName)
		newField[i].name = theName + i;
		i = i + 1;
	}
	var insertHere = document.getElementById('writeroot');
	insertHere.parentNode.insertBefore(newFields,insertHere);
}
window.onload = moreFields;
</script>

<table border="0" align="center">
  <tr>
    <td><div id="readroot" style="display: none" align="center">
      <p class="hr"> </p>
      <table>
        <tr>
          <td><input type="button" value="Remove Traveler" onClick="this.parentNode.parentNode.removeChild(this.parentNode);" align="left">
                <br>
            <br>
                <table width="100%" border="0">
                  <tr>
                    <td><div align="right">Firstname</div></td>
                    <td><div align="center"></div></td>
                    <td><label> 
                      <input type="text" name="Name1_co" id="Name1_co" onchange="copyValue(this);">
                       </label></td>
                  </tr>
                  <tr>
                    <td><div align="right">Lastname</div></td>
                    <td><div align="center"></div></td>
                    <td><label> 
                      <input type="text" name="Name2_co" id="Name2_co" onchange="copyValue(this);">
                       </label></td>
                  </tr>
                  <tr>
                    <td><div align="right">Nickname</div></td>
                    <td><div align="center"></div></td>
                    <td><label>
                      <input type="text" name="nickname" id="nickname" onchange="copyValue(this);">
                      </label>
                    </td>
                  </tr>
                  
</table>
        </table>
      <input name="ref" type="hidden" value="" />
</div>
      <form >
        <div align="right"><span id="writeroot"></span>
            <input type="button" value="more Traveler" onClick="moreFields()">
          <input type="submit" value="Generated Your Reservation" onClick="TabbedPanels1.showPanel(4); return false;" />
        </div>
    </form></td>
  </tr>
  <tr>
    <td><div style="display: none" align="center">
      <table>
        <tr>
          <td><table width="100%" border="0">
              </table>
        </table>
    </div></td>
  </tr>
</table>

whats wrong with this script ?
if i click more traveler, id in like "Name1_co" nothing change. the most like "Name1_co1" in second form.
and i am sorry because i newbie

[abduraooft]

You can't have the same id for more than one element in a document. I think, your insertBefore with that cloneNode violates this.

PS: Do you know why tables for layout is stupid? Have a look at http://www.alistapart.com/articles/p...ccessibleforms to see how to make a semantic accessible form.

[noztox]

You can't have the same id for more than one element in a document. I think, your insertBefore with that cloneNode violates this.

PS: Do you know why tables for layout is stupid? Have a look at http://www.alistapart.com/articles/p...ccessibleforms to see how to make a semantic accessible form.

what is most to do ?, because i am new in javascript and this script copy and little modification from http://www.quirksmode.org/dom/domform.html

maybe u mean change id to name ?

[Philip M]

<input type="text" name="Name1_co" id="Name1_co" onchange="copyValue(this);">
There is no function named copyValue()

When I removed those three references it seemed to work OK.

<script language="JavaScript"> is deprecated and obsolete. Use <script type = "text/javascript"> instead.