动态添加控件javascript Asp.net C＃

Question

我试图在asp.net c＃页面上添加控件，当用户点击时添加另一个。 我正在使用表，并希望在该表中追加控件。 另请告诉我，一旦将表单提交给服务器，我将如何在代码中获取控件值。

Answer 1

这是一个jQuery示例，希望它有所帮助！

ASPX：

 <head id="Head1" runat="server">
    <title>Controls</title>
    <script src="Scripts/jquery-1.7.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnAdd").click(function () {
                var field = $("#field").val();
                var input = "<input name='parameters' id='field' type='text' />";
                var newRow = "<tr><td>" + field + "</td><td>" + input + "</td></tr>";
                $('#controls').append(newRow);
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="field" type="text" />
        <input id="btnAdd" type="button" value="Add" />
        <table id="controls" cellpadding="10" cellspacing="10">
        </table>
        <asp:Button ID="btnProcess" runat="server" Text="Process" OnClick="Process" />
    </div>
    </form>
</body>

代码背后

protected void Process(object sender, EventArgs e)
{
    var parameters = Request.Form["parameters"];
    if (parameters != null && parameters.Count() > 0)
    {
        //Now you have access to the textbox values,perform any additional processing
        parameters.Split(',').ToList().
            ForEach(p =>
            {
                Response.Write(p + "<br />");
            });
    }
}

如果你想在服务器上做所有事情，这是另一个。使用这种方法的问题是，当你动态添加控件时，它们会在回发后消失，你必须在Page_Load重新创建它们，这将为你的服务器增加大量处理，我建议坚持使用jQuery选项

ASPX：

<asp:TextBox ID="txtFieldName" runat="server"></asp:TextBox>
<asp:Button ID="btnAddControl" runat="server" Text="Add" OnClick="Add" />
<asp:Table EnableViewState="true" CellPadding="2" CellSpacing="2" BorderWidth="2" BorderStyle="Solid" GridLines="Both" ID="table"
    runat="server">
    <asp:TableHeaderRow>
        <asp:TableHeaderCell Text="Field" />
        <asp:TableHeaderCell Text="Value" />
    </asp:TableHeaderRow>
</asp:Table>
<asp:Button ID="btnPost" runat="server" Text="Post" OnClick="Post" />

代码背后：

public List<string> rows = new List<string>();

protected void Page_Load(object sender, EventArgs e)
{
    if (ViewState["Rows"] != null)
    {
        rows = (List<string>)ViewState["Rows"];
        if (rows.Count > 0)
        {
            foreach (var row in rows)
            {
                TextBox textbox = new TextBox();
                textbox.Width = 300;
                table.Rows.Add(GetRow(row,textbox));
            }
        }
    }
}

protected void Add(object sender, EventArgs e)
{
    string row = txtFieldName.Text;
    if (!String.IsNullOrEmpty(row))
    {
        rows.Add(txtFieldName.Text);

        TextBox textbox = new TextBox();
        textbox.Width = 300;
        table.Rows.Add(GetRow(row, textbox));
        ViewState["Rows"] = rows;
    }
}

private TableRow GetRow(string text, WebControl txtName)
{
    TableRow tr = new TableRow();

    TableCell cell1 = new TableCell();
    cell1.Text = text;

    TableCell cell2 = new TableCell();
    cell2.Controls.Add(txtName);

    tr.Cells.Add(cell1);
    tr.Cells.Add(cell2);

    return tr;
}

protected void Post(object sender, EventArgs e)
{
    if (table.Rows.Count > 0)
    {
        System.Diagnostics.Debugger.Break();
        //i=1 because we want to skip the header row
        for (int i = 1; i < table.Rows.Count; i++)
        {
            //Examine the values and do further processing...
            string field = table.Rows[i].Cells[0].Text;
            string value = ((TextBox)table.Rows[i].Cells[1].Controls[0]).Text;
        }
    }
}

Answer 2

如果要添加动态客户端控件，它们将作为值位于Request.Form对象中。 您可以迭代此集合的内容。 请注意，该表必须包含在表单元素中，否则将不会发布。

动态添加控件javascript Asp.net C＃

问题描述

2 个解决方案

解决方案1
8 已采纳 2012-12-21 16:58:26

解决方案2
1 2012-12-21 12:00:38

动态添加控件javascript Asp.net C＃

问题描述

2 个解决方案

解决方案1 8 已采纳 2012-12-21 16:58:26

解决方案2 1 2012-12-21 12:00:38

解决方案1
8 已采纳 2012-12-21 16:58:26

解决方案2
1 2012-12-21 12:00:38