【代码笔记】动态添加删除带标题的表单控件【ASPX为基础.Net控件实现版】

喜欢ヅ旅行 2022-10-02 12:00 28阅读 0赞

### 动态添加删除带标题的表单控件 【ASPX为基础 .Net控件实现版】 ###

*   *  ASPX
     *  ASPX.CS

## ASPX ##

<asp:Repeater ID="rptList" runat="server" OnItemDataBound="rptList_ItemDataBound" OnItemCommand="rptList_ItemCommand"> 
                <ItemTemplate>
                	<div class="li-table">
                		
                		<span>报名者<%# Container.ItemIndex+1 %></span>
                		<span class='<%# Container.ItemIndex==0?"display-none":"display-close" %>' >
    	                	<asp:Button ID="btnDel" runat="server" OnClick="btnDel_Click" CssClass="closeBtn" />
                        </span>
    					<div class="li_input">姓名：<asp:TextBox ID="txtName" runat="server" Text='<%# Eval("Name") %>'></asp:TextBox></div>
    					<div class="li_input">年龄：<asp:TextBox ID="txtAge" runat="server" Text='<%# Eval("Age") %>'></asp:TextBox></div>
    					<div class="li_input">性别：<asp:TextBox ID="txtSex" runat="server" Text='<%# Eval("Sex") %>'></asp:TextBox></div>
    				</div>
                </ItemTemplate>
                </asp:Repeater>
                <div class="bottom-line">
                    <asp:Button ID="btnAdd" runat="server" Text="添加" OnClick="btnAdd_Click" />
                </div>
                <div class="bottom-line">
                    <asp:Button ID="btnSave" runat="server" Text="保存" OnClick="btnSave_Click" />
                </div>

## ASPX.CS ##

private void InitData()
            { 
            	//根据需求也可以从数据库中读取数据 这样就不用添加行 此处RowNum为例 DataTable若无列则等同无数据
                DataTable dt = new DataTable();
                dt.Columns.Add("RowNum", typeof(int));
                DataRow dr = dt.NewRow();
                dr["RowNum"] = 1;
                dt.Rows.Add(dr);
                ViewState["datatable"] = dt;
                rptList.DataSource = dt;
                rptList.DataBind();
            }
    
            protected void btnAdd_Click(object sender, EventArgs e)
            { 
                DataTable dt = (DataTable)ViewState["datatable"];
                DataRow dr = dt.NewRow();
                dr["RowNum"] = (int)dt.Select("", "RowNum DESC")[0]["RowNum"] + 1;
                dt.Rows.Add(dr);
                ViewState["datatable"] = dt;
                rptList.DataSource = dt;
                rptList.DataBind();
            }
    
            protected void btnDel_Click(object sender, EventArgs e)
            { 
                RepeaterItem ri = (RepeaterItem)((Button)sender).NamingContainer;
                DataTable dt = (DataTable)ViewState["datatable"];
                foreach (DataRow dr in dt.Rows)
                { 
                    if (int.Parse(dr["RowNum"].ToString()) == ri.ItemIndex)
                    { 
                        dt.Rows.Remove(dr);
                        break;
                    }
                }
                ViewState["datatable"] = dt;
                rptList.DataSource = dt;
                rptList.DataBind();
    
            }

*旨在提供思考起点，实际需求往往以此为基础再附加一些要求*

[【代码笔记】动态添加删除带标题的表单控件【HTML为基础 jQuery实现版】][HTML_ jQuery]

[HTML_ jQuery]: https://blog.csdn.net/u014294325/article/details/92798540