动态表格的增加和删除

 

<% @ Page Language = " C# "  AutoEventWireup = " true "   CodeFile = " Default.aspx.cs "  Inherits = " _Default "   %>

<! DOCTYPE html PUBLIC  " -//W3C//DTD XHTML 1.0 Transitional//EN "   " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >

< html xmlns = " http://www.w3.org/1999/xhtml "   >
< head runat = " server " >
     < title > 无标题页 </ title >
     < script language = " javascript "  type = " text/javascript " >
       function test(r)
        ... {
         window.alert('ssdsd');
          var i=r.parentNode.parentNode.rowIndex;
         document.getElementById('tblvalue').deleteRow(i)

       }
        function AddItem()
         ... {
            var counts=parseInt(document.all("hdhidden").value);
        var Row,Cell;
        var CurrentPosition=parseInt(counts);
        Row = window.tblvalue.insertRow();
        Cell = Row.insertCell();                                
        Cell.innerHTML="<input type=checkbox name=chk_" + CurrentPosition +" id=chkbox_"+ CurrentPosition+"; value='C'>";
        Cell = Row.insertCell();
        Cell.innerHTML="<input size=8 maxlength=8; style=Font-size=11; type=Text name=txtval1_" + CurrentPosition +" id=txtval1_"+ CurrentPosition+";>";
        Cell = Row.insertCell();
        Cell.innerHTML="<input size=15 maxlength=50; style=Font-size=11; type=Text name=txtval2_" + CurrentPosition +" id=txtval2_"+ CurrentPosition+";>";
        Cell = Row.insertCell();
        Cell.innerHTML="<input size=15 ; style=Font-size=11; type=button name=btnval2_" + CurrentPosition +" id=btnval2_"+ CurrentPosition+" value='DELETE' οnclick='test(this)';>";
        document.all("hdhidden").value = parseInt(counts) + 1;
        return false;
        }
     </ script >
</ head >
< body >
     < form id = " form1 "  runat = " server " >
     < div >
         < table style = " width: 50% " >
             < tr >
                 < td style = " width: 100px; height: 21px " >
                     < asp:Table id = " tblvalue "   runat = " server "  Width = " 428px " >
                      < asp:TableRow >
                         < asp:TableCell Width = " 25% " ></ asp:TableCell >
                         < asp:TableCell Width = " 35% "  Font - Bold = " True "  Text = " Value 1 " ></ asp:TableCell >
                         < asp:TableCell Width = " 35% "  Font - Bold = " True "  Text = " Value 2 " ></ asp:TableCell >
                         < asp:TableCell Width = " 35% "  Font - Bold = " True "   ></ asp:TableCell >
                     </ asp:TableRow >
             </ asp:Table >
                 </ td >
                 < td style = " width: 100px; height: 21px " >
                     & nbsp; < asp:Button id = " btnadd "   runat = " server "  Text = " Add " ></ asp:Button >
             < asp:Button id = " btndelete "  runat = " server "  Text = " Delete " ></ asp:Button >& nbsp;
                 </ td >
                 < td style = " width: 100px; height: 21px " >
                 </ td >
             </ tr >
             < tr >
                 < td style = " width: 100px " >
             < input id = " hdhidden "  runat = " server "   type = " text "  value = " 1 "   /></ td >
                 < td style = " width: 100px " >
                 </ td >
                 < td style = " width: 100px " >
                 </ td >
             </ tr >
             < tr >
                 < td style = " width: 100px " >
                 </ td >
                 < td style = " width: 100px " >
                 </ td >
                 < td style = " width: 100px " >
                 </ td >
             </ tr >
         </ table >
    
     </ div >
     </ form >
</ body >
</ html >

// 后台
btnadd.Attributes.Add( " OnClick " ,  " javascript:return AddItem(); " );