Tuesday, April 26, 2005

DHTML code for adding and deleting rows dynamically 


<HTML>
<HEAD>
<TITLE> Testing Table </TITLE>

<SCRIPT LANGUAGE="JAVASCRIPT">
function addRow(id) {
 var table = eval(id);
 var templateTR = table.tBodies[0].childNodes[0];
 var tr = templateTR.cloneNode(true);
 tr.style.display = "";
 table.tBodies[0].appendChild(tr);
}

function deleteRow(id){
 var checkValue = 0;
 var table = eval(id);
 var templateTR = table.tBodies[0].childNodes;
 var deleteSearchIds = "";

 if (templateTR.length - 1 == 0) {
    alert ("No search criteria available.")
    return false;
 } else {
    for(var i=templateTR.length-1; i>0; i--){
       var checkbox=templateTR[i].firstChild.firstChild;
       if ((checkbox.type == "checkbox")
               &&(checkbox.checked == true)){
          deleteSearchIds += checkbox.value + ":";
          table.tBodies[0].removeChild(templateTR[i]);
       }
    }
 }
}
</SCRIPT>
</HEAD>

<BODY BGCOLOR="ghostwhite" onload="addRow('tempTable')">
<BR><BR><BR><BR >
<CENTER>
<FORM NAME="testForm">
  <TABLE NAME="table1" id="tempTable">
      <TBODY>
         <TR  STYLE="DISPLAY: none">
           <TD>
             <INPUT NAME="CHECK" TYPE="checkbox">
           </TD>
           <TD>
             <INPUT NAME="NAME" >
           </TD>
           <TD>
             <INPUT NAME="HTNO" >
           </TD>
         </TR>
         <TR>
            <TD>   </TD>
            <TD>
              <INPUT NAME="NAME" TYPE="button" VALUE="ADD"
                  ONCLICK="addRow('tempTable')">
            </TD>
            <TD>
              <INPUT NAME="HTNO" TYPE="button" VALUE="DELETE"
                  ONCLICK="deleteRow('tempTable')">
            </TD>
        </TR>
     </TBODY>
</TABLE>
</FORM>
</CENTER>
</BODY>
</HTML>

posted by Pavan Medishetty @ 1:03 PM   0 comments

0 Comments:

Post a Comment

<< Home