现在我要求能够动态添加table行,用js可以实现
然后想在后台获取table每一行内的textbox等控件的值,然后自己设置参数赋值,如何实现,跪求
代码如下:
<%@ 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">          //使用clone方式来生成一行,targetTable是需要添加行的table的ID,sourceTable是clone对象         //talbe的ID,即复制sourceTable的第一行插入到targetTable中,完成增加行的操作         function insertRow(targetTable,sourceTable)         {           var oTBODY     = document.getElementById(targetTable).tBodies.item(0);           var oTBODYData = document.getElementById(sourceTable).tBodies.item(0);           var rowsCount = oTBODYData.rows.length;           for(var i=0;i<rowsCount;i++){             oTBODY.appendChild(oTBODYData.rows[i].cloneNode(true));           }         }                 function deleteRow(Field,targetTable){              var findex = getElementOrder(Field)-1;//此处减1是因sourceTable中有一行是隐藏的              document.getElementById(targetTable).deleteRow(findex);         }                          //  查询出将要删除的行所在的位置index           function getElementOrder(field){               var i = 0;               var order = 0;               var elements = document.getElementsByName(field.name);               for(i=0;i<elements.length;i++){                   order++;                   if(elements[i]==field){                       break;                   }               }               return order;           }    </script></head>
<body>
    <form id="form1" runat="server">
    <div>
        <table id="sourceTable" style="display: none;">
            <tr>
                <td>
                    <input type="text" name="username">
                </td>
                <td>
                    <input type="password" name="password">
                </td>
                <td>
                    <input type="text" name="age">
                </td>
                <td>
                    <input type="button" name="deleteButton" value="删除" onclick="deleteRow(this,'targetTable')">
                </td>
            </tr>
        </table>
        <table id="targetTable">
            <tr>
                <td>
                    用户名
                </td>
                <td>
                    密码
                </td>
                <td>
                    年龄
                </td>
                <td>
                    &nbsp;
                </td>
            </tr>
            <tfoot>
                <tr>
                    <td colspan="4" align="right">
                        <input type="button" value="增加行" onclick="insertRow('targetTable','sourceTable');">
                    </td>
                </tr>
            </tfoot>
        </table>
    </div>
    </form>
</body>
</html>

解决方案 »

  1.   

    怎么获取textbox里输入的内容,然后赋值
      

  2.   

    首先,
    js是没有办法动态添加服务器控件的,
    这点必须明确!你用js动态添加的行,
    只能是html标签,
    一旦提交到后台,
    再刷新,就会全部消失!!
      

  3.   

    然后想在后台获取table每一行内的textbox等控件的值,然后自己设置参数赋值,如何实现,跪求
    上面已经说过不能动态获取WEB控件
    可参考
      

  4.   

    var row=document.getElementById("tab").insertRow();   
    var cell1=row.insertCell();   
    cell1.innerHTML=" <input type='text' id='txt'>";   <table id="tab" width="300" border="1" cellpadding="0" cellspacing="0"   
    borderColorLight="black" borderColorDark="white">
    <tr><td>
    </td></tr>
    </table>

    var oTable = window.document.createElement("table");
    oTable.border = 1;
    var oTR = oTable.insertRow();
    var oTD = oTR.insertCell();
    oTD.innerText = "";
    oTD = oTR.insertCell();
    oTD.rowSpan = 2;
    oTD.innerText = "";
    oTR = oTable.insertRow();
    oTD = oTR.insertCell();
    oTD.innerText = "";
    document.body.appendChild(oTable);