Cloning table row witch contains datepicker

Cloning table row witch contains datepicker

 Hello everybody


I have table where is one row(lets called it row template().I try to add new row ito the table by cloning template row.Here is my test table:

  1. <table>
  2. <tr>
  3.       <td>
  4.             <input type="text" id="datepicker">
  5.       <td>
  6. </tr>
  7. </table>
Here Is my javascript functions:
  1. function addNewEmptyRow()
    {
        var tblBody = document.getElementById("Lines").tBodies[0];
        var newNode = tblBody.rows[0].cloneNode(true);
      
        RenameTableComponents(0,tblBody);
      
        tblBody.appendChild(newNode);
    }








Here is  RenameTableComponents function.The function gives new names and Id for table components and add datepicker to textbox.
  1. function RenameTableComponents(startindex, table) {
        var tbl = table;
        for (var i = startindex; i < tbl.rows.length; i++) {
            var elems = table.rows[i].getElementsByTagName("input");
            for (var j = 0; j < elems.length; j++) {
                if (elems[j].id != null && elems[j].id != 'undefined' && elems[i].id != '') {
                    var splitID = elems[j].id.split('_');
                    var newID = splitID[0] + '_' + i;
                    elems[j].id = newID;
                    if (newID.indexOf("dtOffice") > -1) {

                        $(function() {
                            $('#' + newID).datepicker();

                        });
                    }

                }
            }
            var Selectelems = table.rows[i].getElementsByTagName("select");
            for (var j = 0; j < Selectelems.length; j++) {
                if (Selectelems[j].id != null && Selectelems[j].id != 'undefined' && Selectelems[j].id != '') {
                    var splitID = Selectelems[j].id.split('_');
                    var newID = splitID[0] + '_' + i;
                    Selectelems[j].id = newID;
                    Selectelems[j].name = newID;

                }
            }
        }
       
    }































My problem is this.if add new row and try to change date, it always change the date of the first row. how can make datepicker works on new row ?