JavaScript添加的行无法在c#

时间:2015-07-21 12:36:29

标签: c# asp.net rows

我正在asp.net中创建一个网页。我用runat =" server"创建了一个HTML表。我通过从输入框中获取值,使用JavaScript添加了一些行。我需要在c#后面的代码中访问这些行。当我在后面的代码中使用这个表时,它只给我一行,我在HTML部分中添加了一个表标题。它不考虑JavaScript中添加的行。有没有办法访问这些行?

我的HTML代码:

<table id="tblStaff" border="1" runat="server">
    <tr>
        <th>S. No.</th>
        <th>Staff Name</th>
        <th>Room</th>
        <th>Phone No.</th>
        <th>Remove</th>
    </tr>
</table>

Javascript代码:

function addStaff()
{
    var tbl = document.getElementById('tblStaff');
    var lastRow = tbl.rows.length;
    // if there's no header row in the table, then iteration = lastRow + 1
    var iteration = lastRow;
    var row = tbl.insertRow(lastRow);           

    var cell0 = row.insertCell(0);
    var textNode = document.createTextNode(iteration);
    cell0.appendChild(textNode);

    var cell1 = row.insertCell(1);
    var textNode = document.createTextNode(document.getElementById('txtStaffName').value);
    cell1.appendChild(textNode);

    var cell2 = row.insertCell(2);
    textNode = document.createTextNode(document.getElementById('txtRoomNo').value);
    cell2.appendChild(textNode);

    var cell3 = row.insertCell(3);
    textNode = document.createTextNode(document.getElementById('txtPhoneNo').value);
    cell3.appendChild(textNode);

    var lastCell = row.insertCell(4);
    var el = document.createElement('input');
    el.type = 'button';
    el.name = 'btnDelete' + iteration;
    el.id = 'btnDelete' + iteration;
    el.value = 'Remove';
    el.size = 40;
    el.setAttribute('onclick', 'deleteRow(' + iteration + ');');
    lastCell.appendChild(el);         
}

3 个答案:

答案 0 :(得分:0)

看起来你的addStaff()函数只会添加到前端的表中。如果我可以指出,C#是在服务器端执行的,那么,当您的C#正在寻找时,您的javascript添加的行不存在。

像Florian Gl建议的那样,你可以在你的addStaff()函数中包含一个ajax提交,它也会将javascript在浏览器表格中显示的任何行发送到后端的C#。在C#中获得数据后,您可以继续发送电子邮件,甚至可以选择保存数据库......

答案 1 :(得分:0)

我建议让用户通过表单添加一些数据,然后将其发送到服务器并将其存储在您想要的位置。如果成功,请将重新呈现的表添加到响应中并在客户端上呈现它或仅添加新行客户端。在服务器端,您无法访问新行,但您可以访问其数据模型,这应该足够了。

如果您需要进一步的建议,请详细说明为什么您希望访问服务器端的那些行。

编辑: 看看this fiddle。在那里你可以看到你的桌子必须具有的结构。现在,如果您要添加用户,只需添加此格式的新行,index用户name递增。现在,如果你点击提交,所有用户将作为一个数组发送到服务器,在那里你可以迭代它们并发送电子邮件。

你的web api方法可能如下:

//route url/to/api
public void AddNewUser(User[] users) 
{
   //iterate through users and send email
}

答案 2 :(得分:0)

试试这个

using System.Web.UI.HtmlControls;

 foreach (HtmlTableRow row in tblStaff.Rows)
          {
            string txtCell0 = row.Cells[0].InnerText; 
            string txtCell1 = row.Cells[1].InnerText; 
          }