更新面板内的动态文本框

Question

我正在创建一个 asp.net 页面，该页面在 updatepanel 中有一个值为 0、1、2、3、4 的下拉列表

当用户点击 0 元素时，我想创建一个文本框和一个按钮。当用户单击按钮时，文本框的值应显示在标签中，无需回发

当用户单击元素 1 时，应显示两个文本框，元素 2 为 3，依此类推。

请提出解决方案。

[已编辑]

私有 int tblRows = 5; 私人 int tblCols = 1;

    protected void Page_Load(object sender, EventArgs e)
    {
        CreateDynamicTable();
    }

    private void CreateDynamicTable()
    {

        if( ViewState["tbl"] != null && ViewState["tbl"].ToString() == "true"){
        // Fetch the number of Rows and Columns for the table
        // using the properties

        // Now iterate through the table and add your controls
            for (int i = 0; i < tblRows; i++)
            {
                TableRow tr = new TableRow();
                for (int j = 0; j < tblCols; j++)
                {
                    TableCell tc = new TableCell();
                    TextBox txtBox = new TextBox();
                    txtBox.ID = "txt-" + i.ToString() + "-" + j.ToString();
                    txtBox.Text = "RowNo:" + i + " " + "ColumnNo:" + " " + j;
                    // Add the control to the TableCell
                    tc.Controls.Add(txtBox);
                    // Add the TableCell to the TableRow
                    tr.Cells.Add(tc);

                }
                // Add the TableRow to the Table
                tbl.Rows.Add(tr);
                tbl.EnableViewState = true;
                ViewState["tbl"] = true;
            }
        }
    }

    protected void btnSet_Click(object sender, EventArgs e)
    {
        foreach (TableRow tr in tbl.Controls)
        {
            foreach (TableCell tc in tr.Controls)
            {

                if (tc.Controls[0] is TextBox)
                {
                    Response.Write(((TextBox)tc.Controls[0]).Text);
                }
            }
            Response.Write("<br/>");
        }

    }

    protected override object SaveViewState()
    {
        object[] newViewState = new object[2];

        List<string> txtValues = new List<string>();

        foreach (TableRow row in tbl.Controls)
        {
            foreach (TableCell cell in row.Controls)
            {
                if (cell.Controls[0] is TextBox)
                {
                    txtValues.Add(((TextBox)cell.Controls[0]).Text);
                }
            }
        }

        newViewState[0] = txtValues.ToArray();
        newViewState[1] = base.SaveViewState();
        return newViewState;
    }
    protected override void LoadViewState(object savedState)
    {
        //if we can identify the custom view state as defined in the override for SaveViewState
        if (savedState is object[] && ((object[])savedState).Length == 2 && ((object[])savedState)[0] is string[])
        {
            object[] newViewState = (object[])savedState;
            string[] txtValues = (string[])(newViewState[0]);
            if (txtValues.Length > 0)
            {
                //re-load tables
                CreateDynamicTable();
                int i = 0;
                foreach (TableRow row in tbl.Controls)
                {
                    foreach (TableCell cell in row.Controls)
                    {
                        if (cell.Controls[0] is TextBox && i < txtValues.Length)
                        {
                            ((TextBox)cell.Controls[0]).Text = txtValues[i++].ToString();

                        }
                    }
                }
            }
            //load the ViewState normally
            base.LoadViewState(newViewState[1]);
        }
        else
        {
            base.LoadViewState(savedState);
        }
    }

    protected void Button1_Click(object sender, EventArgs e)
    {
        CreateDynamicTable();
    }

谢谢

Answer 1

这有两个困难。 首先：创建两个或更多控件而不回发。 第二：调用方法从文本框中获取数据并放置在标签中，同样无需回发。

我想我只能在解决方案的第二部分提供帮助，我想。 要在没有回发的情况下与控件进行交互（这意味着，只能在客户端工作），我只能建议在 web 表单的标题中添加一个 javascript 函数。像这样的：

<script type="text/javascript">
    function DysplayTextInLabel (){
         // This function get the text from TextBoxID and place in the LabelID
         var TxtData document.getElementbyId("<%=TextBoxID.ClientID%>").value;
         document.getElementbyId("<%=LabelID.ClientID%>").innerHTML = TxtData;
    }
</script>

然后您必须使用客户端事件调用程序来调用 DysplayTextInLabel 函数。由于所有按钮都具有自动回发功能，即使您在 aspx 代码中设置了 autopostback = false，它仍然会在您的代码隐藏中刷新页面：

protected void Page_Load(object sender, EventArgs e)
{
    CreateDynamicTable();
    // The (!isPostBack) will verify if is the first time run of the code 
    if(!isPostBack){
        // This will remove the postback from button2
        Button2.Attributes.Add("OnClick", "return false;");
        // This will execute the DysplayTextInLabel without postback 
        Button2.Attributes.Add("OnClick", "return DysplayTextInLabel();");
    }
}

此代码适用于已创建的按钮 (Button2)，因为我们在 Page_Load 中与它进行交互。对于在客户端动态创建的按钮，我无法帮助您，但我只能针对问题的 First 部分研究 javascript 函数。 我希望这可以帮助你。祝你好运。