I use clonetry to add new raw in table and rename the input field id, name, the id is changed, but  the name doesn't updated and select filed not work for new raw. Thanks for any suggestions. Here is the sample:

 

<script type="text/javascript" src=" http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
 
$(document).ready(function() {

  $("#item_no1").click(function() {
    var row = $('#mytable tbody>tr:last').clone(true).insertAfter('#mytable tbody>tr:last');
    var index = $("#mytable tbody>tr").length;
    var myselectChange ="nmselectChanged(this, "  + index + ')'
//    var myselectChange ="nmselectChanged(this.options[this.selectedIndex].value,"  + index + ')'

    alert (myselectChange);
  
    $("td:eq(0)", row).text(index);
    $("td:eq(1) input", row).attr("name", "item_no" + index).attr("id", "item_no" + index).attr("value", "" )
    $("td:eq(2) div", row).attr("id", "otherNameType_" + index)
    $("td:eq(2) div", row).children(".fname").sttr("id", "fname"+ index).attr("name", "fname"+ index);

    //$("td:eq(2) div:mname", row).attr("id", "mname"+ index).attr("name", "mname"+ index);
    //$("td:eq(2) div:lname", row).attr("id", "lname"+ index).attr("name", "lname"+ index);
    $("td:eq(2) SELECT", row).attr("name", "item-opt" + index).attr("id", "item-opt" + index).attr("onchange", myselectChange );
 
    //$("#mytable").append(row); //add the row back to the table row
 
    return false;
  });

$('#item-desc1').click(function() {
   $('#item_no1').click();
});

 

});
 
function popup() {
 
var tbl = document.getElementById("mytable");
    alert(tbl.innerHTML   )
}

function nmselectChanged(listObj, id ) {

   var val =listObj.options[listObj.selectedIndex].value;
   var obj =document.getElementById("otherNameType_"+id);
   alert("nmselectChanged val="+ val + ", id="+id)
 
  if (obj !=null) { 
    if(val == "01"){
    obj.style.display = 'block';
     }else{
     obj.style.display = 'none';
    }

  }
 
}
 
 
</script>
 

<table id="mytable" border="0" align="left" cellpadding="2" cellspacing="1" bgcolor="#999999">
  <thead>
    <tr>
      <th bgcolor="#ecf6fc" scope="col">No.</th>
        <th bgcolor="#ecf6fc" scope="col">Description</th>
    <th bgcolor="#ecf6fc" scope="col"   width=500 >Option</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td bgcolor="#ecf6fc" align="center">1</td>
      <td bgcolor="#ecf6fc"><input name="item_no1" type="text" id="item_no1"  value="abcd"  /></td>
      <td bgcolor="#ecf6fc">
<SELECT name="item-opt1" id="item-opt1" onchange="nmselectChanged(this, 1)";>
<OPTION VALUE="00">close
<OPTION VALUE="01">Resume
 
</SELECT>
<div id="otherNameType_1" style="display:none;" class="otherNameType">
<input type="text" name="fname" size='15' id='fname' value='first' >
<input type="text" name="mname" size='10' id='mname' value='middle' >
<input type="text" name="lname" size='20' id='lname' value='last'  >

<input type="text" name="suffix" size='4'  >
</div>
</td>
</tr>
   
  </tbody>
</table>
 
<input type="button" onclick="popup()" value="popup">