title: Adding/Removing row dynamically in html using javascript
body: <p>I have this particular snippet..</p>
  
  <pre><code>newcell.innerHTML = table.rows[0].cells[i].innerHTML;
  //alert(newcell.childNodes);
  switch(newcell.childNodes[0].type) {
  case "text":
      newcell.childNodes[0].value = "";
      break;
  case "checkbox":
      newcell.childNodes[0].checked = false;
      break;
  case "select-one":
      newcell.childNodes[0].selectedIndex = 0;
      break;
  case "number":
      newcell.childNodes[0].value = '';
      break;
  }
  </code></pre>
  
  <p>the switch above makes the newly added rows to reset the value from the copied row.</p>
  
  <p>the text and number resets.</p>
  
  <p>but the drop-down and checkboxes do not</p>
  
  <p>what commands does these two need to reset their values?
  for the dropdown, the first option and for the checkboxes is no box is checked</p>
  
  <p><strong>EDIT: this is the whole code</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      function addRow(tableID) {
  
          var table = document.getElementById(tableID);
  
          var rowCount = table.rows.length;
          var row = table.insertRow(rowCount);
  
          var colCount = table.rows[0].cells.length;
  
          for(var i=0; i&lt;colCount; i++) {
              var newcell=row.insertCell(i);
              newcell.innerHTML=table.rows[1].cells[i].innerHTML;
              switch(newcell.childNodes[0].type) {
                  case "text":
                      newcell.childNodes[0].value = "";
                      break;
                  case "checkbox":
                      newcell.childNodes[0].checked = false;
                      break;
                  case "select-one":
                      newcell.childNodes[0].selectedIndex = 0;
                      break;
                  case "number":
                      newcell.childNodes[0].value = '';
                      break;
              }
          }
      }
      function deleteRow(tableID) {
          try {
          var table = document.getElementById(tableID);
          var rowCount = table.rows.length;
          var colCount = table.rows[0].cells.length;
  
          for(var i=0; i&lt;rowCount; i++) {
              var row = table.rows[i];
              var chkbox = row.cells[colCount-1].childNodes[0];
              if(null != chkbox &amp;&amp; true == chkbox.checked) {
                  if(rowCount &lt;= 2) {
                      alert("Cannot delete all the rows.");
                      break;
                  }
                  table.deleteRow(i);
                  rowCount--;
                  i--;
              } 
          }
          }catch(e) {
              alert(e);
          }
      }
  &lt;/script&gt;
  &lt;body&gt;
  &lt;label&gt;&lt;input type="checkbox" id='checkboxId'&gt;N/A&lt;/label&gt;   
  &lt;br&gt;
  &lt;div id="div-table-id"&gt;
      &lt;table id='table-id' border="1"&gt;
          &lt;tr&gt;
              &lt;th&gt;Subject&lt;/th&gt;
              &lt;th&gt;Section Code&lt;/th&gt;
              &lt;th&gt;Room&lt;/th&gt;
              &lt;th&gt;Days&lt;/th&gt;
              &lt;th&gt;Start Time&lt;/th&gt;
              &lt;th&gt;End Time&lt;/th&gt;
              &lt;th&gt;Hours Per Week&lt;/th&gt;
              &lt;th&gt;No of Students (A)&lt;/th&gt;
              &lt;th&gt;Course Credit w/o multiplier(B)&lt;/th&gt;
              &lt;th&gt;Student Credit Units (AxB)&lt;/th&gt;
              &lt;th&gt;Teaching Load Credits with Multiplier&lt;/th&gt;
              &lt;th&gt;Delete?&lt;/th&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;select name="subject" &gt;
                      &lt;option value="cmsc2"&gt;CMSC2&lt;/option&gt;
                      &lt;option value="cmsc11" selected="selected"&gt;CMSC11&lt;/option&gt;
                      &lt;option value="cmsc121"&gt;CMSC121&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/td&gt;
              &lt;td&gt;&lt;input type="text" id="password" value="sample"/&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input type="text" id="password2" value="sample"/&gt;&lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="checkbox" name="days" value="m" checked&gt;M
                  &lt;input type="checkbox" name="days" value="t"&gt;T
                  &lt;input type="checkbox" name="days" value="m"&gt;W
                  &lt;input type="checkbox" name="days" value="th"&gt;Th
                  &lt;input type="checkbox" name="days" value="f"&gt;F
                  &lt;input type="checkbox" name="days" value="s"&gt;S
              &lt;/td&gt;
              &lt;td&gt;&lt;input type="time" name="start_time"&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input type="time" name="end_time"&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input type="number" name="hpw"&gt;&lt;/td&gt;   
              &lt;td&gt;&lt;input type="number" name="nos"&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input type="number" name="ccm"&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input type="number" name="scu"&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input type="number" name="tlcm"&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input type="checkbox" name="chk"&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
      &lt;input type="button" value="Add Row" onclick="addRow('table-id')" /&gt;
      &lt;input type="button" value="Delete Row" onclick="deleteRow('table-id')"/&gt;       
      &lt;input type="button" value="Save"/&gt;
  
  &lt;/div&gt;
  
  &lt;script&gt;
      document.getElementById('checkboxId').onchange = function () {
          var elems = document.getElementById('div-table-id').querySelectorAll('input,select,textarea');
          if (document.getElementById('checkboxId').checked) {
              for (var i = 0; i &lt; elems.length; i++) {
                  elems[i].disabled = true;
              }
          } else {
              for (var i = 0; i &lt; elems.length; i++) {
                  elems[i].disabled = false;
              }    
          }
      }
      document.getElementById('password2').disabled = true;
      document.getElementById('password').onblur = function(){
          if(document.getElementById('password').value != '')
              document.getElementById('password2').disabled = false;
          else{
              document.getElementById('password2').value = '';
              document.getElementById('password2').disabled = true;
          }
          document.getElementById("password2").select();
      }
      document.getElementById('password2').onblur = function (){
          if(document.getElementById('password').value == '')
              return;
          check();
      }
  
      function check() {
          if (document.getElementById('password2').value != document.getElementById('password').value) {
              alert('The two passwords must match.');
              document.getElementById("password").select();
              document.getElementById('password2').value = '';
          }
          else 
              alert('The two passwords matched.');
      }
  &lt;/script&gt;
  </code></pre>