2011-05-25 71 views
0

我有這個表單代碼來動態添加行。我如何動態添加日期?如何在使用JavaScript的窗體中動態添加日期?

<HTML> 
<HEAD> 
    <TITLE> Add/Remove dynamic rows in HTML table </TITLE> 
    <SCRIPT language="javascript"> 
     function addRow(tableID) { 

      var table = document.getElementById(tableID); 

      var rowCount = table.rows.length; 
      var row = table.insertRow(rowCount); 

      var cell1 = row.insertCell(0); 
      var element1 = document.createElement("input"); 
      element1.type = "checkbox"; 
      cell1.appendChild(element1); 

      var cell2 = row.insertCell(1); 
      cell2.innerHTML = rowCount + 1; 

      var cell3 = row.insertCell(2); 
      var element2 = document.createElement("input"); 
      element2.type = "text"; 
      cell3.appendChild(element2); 

     } 

     function deleteRow(tableID) { 
      try { 
      var table = document.getElementById(tableID); 
      var rowCount = table.rows.length; 

      for(var i=0; i<rowCount; i++) { 
       var row = table.rows[i]; 
       var chkbox = row.cells[0].childNodes[0]; 
       if(null != chkbox && true == chkbox.checked) { 
        table.deleteRow(i); 
        rowCount--; 
        i--; 
       } 

      } 
      }catch(e) { 
       alert(e); 
      } 
     } 

    </SCRIPT> 
</HEAD> 
<BODY> 

    <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /> 

    <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /> 

    <TABLE id="dataTable" width="350px" border="1"> 
     <TR> 
      <TD><INPUT type="checkbox" name="chk"/></TD> 
      <TD> 1 </TD> 
      <TD> <INPUT type="text" /> </TD> 
     </TR> 
    </TABLE> 

</BODY> 
</HTML> 

這用於添加行的代碼動態

這是日曆

<script language="JavaScript" src="calendar_us.js"></script> 
    <link rel="stylesheet" href="calendar.css"> 

<INPUT type="text" name="testinput" /> 
<script language="JavaScript"> 

    new tcal ({ 

     // form name 

     'formname': 'testform', 

     // input name 

     'controlname': 'testinput' 
    }); 

    </script> 
+0

可以使用,而不是由JavaScript和更好的使用jQuery – XMen 2011-05-25 11:18:43

+1

,你可以添加日期,就像您添加文本框 – XMen 2011-05-25 11:19:26

回答

1

添加例如一個新的小區中的代碼,

var cell4 = row.insertCell(3); 
cell4.innerHTML = new Date(); 

<TR> 
    <TD><INPUT type="checkbox" name="chk"/></TD> 
    <TD> 1 </TD> 
    <TD> <INPUT type="text" /> </TD> 
    <TD> <INPUT type="text" name="testinput" /></TD> 
</TR> 

你能解釋在哪裏插入日期嗎?

+0

的日期必須在旁邊的小區3 – 2011-05-25 11:38:26

+0

插入表中添加單元格,並得到幫助添加模板功能來自calendar_us.js的手冊。如果新單元不可能,那麼創建一個新元素並像之前一樣追加它。給它的名字如預期的烏爾js – MLS 2011-05-25 11:39:46

相關問題