Question

我在应用程序中创建用户配置文件有以下要求：

用户应该能够在他的个人资料中输入多个电话号码/电子邮件地址屏幕看起来有点像这样：
- 默认情况下，在页面加载时会显示一个用于电话和电子邮件的文本框 - 用户可以单击“+”按钮添加其他号码/地址 - 单击“+”按钮时，我们需要在第一个下方添加另一个文本框。用户可以根据需要添加任意数量的数字/地址。提交时，服务器应收集所有数字/电子邮件并将其保存在数据库中。

我尝试使用Repeater控件执行此操作。在page_load上，我将转发器绑定到一个大小为1的“新arraylist”对象。因此，这呈现得很好 - 用户看到一个没有值的文本框。
当他点击“+”按钮时，理想情况下我想使用javascript创建更多带有与第一个类似标记的文本框。

我的问题是这些：

我可以使用js渲染新的文本框吗？我注意到由转发器控件呈现的HTML有点复杂（名称/ ID）等，并且可能无法在客户端正确创建这些控件。
如果有办法做＃1，服务器是否会理解这些附加输入是转发器控件中的项目？说，我想通过迭代Repeater.DataItems来获取用户输入的所有电话号码。
从概念上讲，我的方法是正确的还是使用Repeater这是错误的？你会建议任何其他方法可以处理这个要求吗？

来自Struts / JSP背景，我仍然在努力控制.NET的做事方式 - 所以任何帮助都会受到赞赏。

Answer 1

转发器控制对于您要完成的任务可能有点过分。它主要是指用于呈现数据行的数据绑定控件。

您可以做的是在Page_Load事件（C＃）中动态创建框：

TestInput.aspx：

<form id="form1" runat="server">
    <asp:HiddenField ID="hdnAddInput" runat="server" />
    <asp:Button ID="btnPlus" OnClientClick="setAdd()" Text="Plus" runat="server" />
    <asp:PlaceHolder ID="phInputs" runat="server" />

</form>
<script type="text/javascript">
    function setAdd() {
        var add = document.getElementById('<%=hdnAddInput.ClientID%>');
        add.value = '1';
        return true;
    }
</script>

TestInput.aspx.cs：

protected void Page_Load(object sender, EventArgs e)
{
    if (ViewState["inputs"] == null)
        ViewState["inputs"] = 1;

    if (hdnAddInput.Value == "1")
    {
        ViewState["inputs"] = int.Parse(ViewState["inputs"].ToString()) + 1;
        hdnAddInput.Value = "";
    }

    for (int loop = 0; loop < int.Parse(ViewState["inputs"].ToString()); loop++)
        phInputs.Controls.Add(new TextBox() { ID = "phone" + loop });
}

我最终使用PlaceHolder动态添加文本框，并在需要添加其他HiddenField时标记TextBox。由于ID是匹配的，因此它会在每次回发期间维护控件的ViewState。

Answer 2

欢迎使用ASP.NET中动态添加控件的毛球。它不漂亮，但可以做到。

您无法使用javascript动态添加新字段，因为新字段在页面的服务器端控件集合中没有任何表示。

鉴于要求是用户可以添加到页面的地址数量没有限制，您唯一的选择是执行“传统”动态ASP.NET控件。这意味着您必须通过new处理控制服务器端的添加 - 使用新的对象来表示控件：

private ArrayList _dynamicControls = new ArrayList();
public void Page_Init()
{
    foreach (string c in _dynamicControls)
    {
        TextBox txtDynamicBox = new TextBox();
        txtDynamicBox.ID = c;
        Controls.Add(txtDynamicBox);
    }
}

public void AddNewTextBox()
{
    TextBox txtNewBox = new TextBox();
    txtNewBox.ID = [uniqueID] //  Give the textbox a unique name
    Controls.Add(txtNewBox);    
    _dynamicControls.Add([uniqueID]);
}

您可以在此处看到，支持每个动态添加字段的对象必须添加回每个回发上的Page 的Controls集合。如果你不这样做，那么从现场发回的数据无处可去。

Answer 3

如果你想使用转发器，我认为最简单的方法是将转发器放在ASP.Net AJAX更新面板中，在服务器端添加额外的文本框。

如果不使用转发器，还有其他方法可以实现这一点，使用js添加文本框可能更容易。

Answer 4

不，但您可以创建与input控件所呈现的TextBox元素类似的元素。
没有。 ASP.NET保护自己免受发布到服务器的虚假数据的影响。您不能通过添加它将返回的数据来使服务器代码认为它之前创建了TextBox。
方法错了。你试图采取不起作用的中间方式。你必须向任何一个方向前进。要么回发并在服务器端添加TextBox，要么在客户端完全执行，并使用Request.Form集合在服务器端接收数据。
< / LI>

ASP.Net - 使用Repeater在客户端重复输入框

4 个答案: