C# 按按钮时动态添加用户控件

C# 按按钮时动态添加用户控件,c#,javascript,asp.net,user-controls,page-lifecycle,C#,Javascript,Asp.net,User Controls,Page Lifecycle,我的问题是,我试图在单击按钮后将用户控件动态添加到页面。听起来很直截了当。基本上有一个文本字段,旁边有一个添加按钮,在添加按钮上单击我想将文本框设置为只读并保留文本,将添加按钮更改为删除并添加一个新的文本字段和下面的添加按钮。本质上,我们可以向列表中添加多个项目 我提出的解决方案是单击add按钮,将文本框中的单词添加到包含用户已输入的所有单词的列表中,然后将该列表添加到会话中。当回发发生时,我只是从会话中抓取列表并重新填充已经添加的文本框。问题是,在ASP.NET页面生命周期中,按钮单击事件实际

我的问题是,我试图在单击按钮后将用户控件动态添加到页面。听起来很直截了当。基本上有一个文本字段,旁边有一个添加按钮,在添加按钮上单击我想将文本框设置为只读并保留文本,将添加按钮更改为删除并添加一个新的文本字段和下面的添加按钮。本质上,我们可以向列表中添加多个项目

我提出的解决方案是单击add按钮,将文本框中的单词添加到包含用户已输入的所有单词的列表中,然后将该列表添加到会话中。当回发发生时,我只是从会话中抓取列表并重新填充已经添加的文本框。问题是,在ASP.NET页面生命周期中,按钮单击事件实际上发生在页面加载事件之后,因此,如果我试图通过抓取会话中的列表来添加文本框,则它尚未填充。相反,如果我尝试在page load complete事件中添加文本框,按钮事件在单击时不会触发(不完全确定原因,但可能是因为事件绑定到这两个事件之间的某个按钮)


因此,在仔细研究了一下之后,似乎仅使用ASP.NET和C#是不可能做到这一点的,但可能有一种方法可以使用javascript做到这一点。有人知道怎么做吗?我对C#非常熟悉,对javascript也很熟悉,但我对ASP.NET非常陌生,希望您能提供帮助

您可以使用JQuery完成以下功能

HTML

<div id="myDiv">
    <div id="item1">
        <input id="txt1" name="txt1" type="text"></input><input id="cmdAdd1" type="button" value="Add"></input>
    </div>
</div>

您是否考虑过使用AJAX工具包和UpdatePanel,这样就不必在会话中存储数据。只有页面的一部分会重新加载,您可以在一个区域保留数据,而OnClick仍会在另一个区域触发事件。如果可能的话,我会尽量避免使用AJAX来执行此操作,但如果我找不到一个好方法,我将尝试下一步。感谢Tony提供的解决方案,效果非常好,你应该知道,不要试图在服务器端完成大部分工作。我要做的唯一更改是C#代码中的while循环,因为一些文本框可能会被删除,while循环可能会提前终止。
var itemCount = 1;
$('#cmdAdd1').click(function(){addNewItem();});

function addNewItem(){
    var thisItem = itemCount;
    // Make last text box readonly
    $('#txt' + itemCount).attr('readonly', 'readonly');
    // Change button to Remove button
    $('#cmdAdd' + itemCount).attr('value', 'Remove');
    $('#cmdAdd' + itemCount).unbind();
    $('#cmdAdd' + itemCount).click(function(){removeItem(thisItem );}); 

    // Add new line with text field and button
    itemCount++;
    var newItem = '<div id="item' + itemCount + '">'
    newItem += '<input id="txt' + itemCount + '" name="txt' + itemCount + '" type="text"></input>';
    newItem += '<input id="cmdAdd' + itemCount + '" type="button" value="Add"></input>';
    newItem += "</div>";

    $('#myDiv').append(newItem);
    $('#cmdAdd' + itemCount).click(function(){addNewItem();});    
}

function removeItem(i){
    $('#item' + i).remove();
}
int n=1;
while (Request["txt" + n] != null)
{
    Console.WriteLine(Request["txt" + n]);
    n++;
}