Question

我正在尝试创建：

加载两个文本框（“item”和“amount”）和“添加”按钮的表单。
每次点击“添加”按钮，都会添加另一组与第一个相同的文本框。
单击“添加”按钮时，文本框需要保留输入的内容。

最好的方法是什么？我一直在尝试很多不同的事情，但没有一个做得很好。

Answer 1

我不得不在win表单和网页上做过几次这样的事情。不幸的是，在网页上它并不像在win表单上那么容易。我确定那里有JQuery实现，但我过去的方式是使用转发器。

处理item命令事件有点棘手，但我会尝试尽可能地减少它。关于这个特定项目的一个小背景是我想出了一个界面，人们可以在其中编辑他们网页上的链接。原版在转发器中包含了更多的控件，但我将它缩小了，因此不会占用太多空间。

首先，声明转发器很容易：

<asp:Repeater ID="rptLinks" runat="server">
    <HeaderTemplate>
        <table style="width:99%; text-align:center; margin-left:auto; margin-right:auto"><tr>
                <td style="width:15%;"><asp:Label ID="lblDisplayName" runat="server" Text="Display Name:"></asp:Label></td>
            </tr>
    </HeaderTemplate>
    <ItemTemplate>
        <tr>
            <td style="width:15%;"><asp:TextBox ID="txtLinkDisplayName" runat="server" Width="95%" Text='<%#Bind("Name") %>'></asp:TextBox></td>
            <td style="width:5%;"><asp:Button ID="btnLinkSave" runat="server" Text="" CssClass="linkButton" style="background-image:url('Images/Save_16.png')" ToolTip="Update Link" CommandName="Update" CommandArgument='<%#Eval("Customer_Link_ID") %>' /></td>
            <td style="width:5%;"><asp:Button ID="btnLinkClear" runat="server" Text="" CssClass="linkButton" style="background-image:url('Images/Cancel_16.png')" ToolTip="Delete Link" CommandName="Delete" CommandArgument='<%#Eval("Customer_Link_ID") %>'/></td>
        </tr>
    </ItemTemplate>
    <FooterTemplate>
            <tr>
                <td style="width:15%;"><asp:TextBox ID="txtLinkDisplayName" runat="server" Width="95%"></asp:TextBox></td>
                <td style="width:5%;"><asp:Button ID="btnLinkNew" runat="server" Text="" CssClass="linkButton" style="background-image:url('Images/Add_16.png')" ToolTip="Save New Link" CommandName="New" /></td>
                <td style="width:5%;"><asp:Button ID="btnLinkCancel" runat="server" Text="" CssClass="linkButton" style="background-image:url('Images/close_16.png')" ToolTip="Clear" CommandName="Clear" /></td>
            </tr>
        </table>
    </FooterTemplate>
</asp:Repeater>

基本上所有这一切都是为转发器创建一个模板。标题部分启动表并包含单个标签。项目模板用于显示绑定到转发器的数据。这种情况下的文本是使用服务器端包含绑定的，“绑定”函数中的值需要与绑定到转发器的表中的列完全匹配。在这种情况下，页脚是您输入新条目的位置，也会关闭表标记。模板和页脚都包含2个按钮。重要的是要注意CommandName值是相应设置的，因为稍后将在服务器端使用它。

因此，一旦客户端全部设置完毕，我们将需要在服务器上处理item命令事件。我将我的功能设置为：

    Private Sub rptLinks_ItemCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.RepeaterCommandEventArgs) Handles rptLinks.ItemCommand
    Try
        'This clears the datasource because if I didn't do this I was getting weird behavior.
        rptLinks.DataSource = Nothing
        rptLinks.DataBind()
        Select Case e.CommandName
            Case "New"
                 'Do whatever you need to for a new record
            Case "Update"
                 'Do whatever you need to to update the record
            Case "Clear"
                 'Clear the controls
            Case "Delete"
                 'Delete the link that is in this row
            Case Else
        End Select
        'rebind the repeater to the updated data.
        rptLinks.DataSource = LinksDatatable
        rptLinks.DataBind()
    Catch ex As Exception
    End Try
End Sub

这是我发现确定点击哪个按钮的最简单方法，但我确信还有其他方法可以实现它。

现在，一旦你遇到需要处理的情况，你最终需要从控件中获取值，以及你通过以下方式获取的值：e.Item.FindControl("txtLinkDisplayName")。在我的例子中，我在directcast（）调用中使用了该代码，并根据需要转换控件以使它们更易于使用。

因此，一旦完成所有这些，数据绑定并处理每个案例，那么您应该准备好了。

通过按钮单击动态添加控件

1 个答案: