文章参考:文章参考http://www.cnblogs.com/dataadapter/archive/2012/06/25/2562885.html

效果:

前台代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="rptTest.Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div class="dataTable" >
<asp:HiddenField ID="hfRptColumns" runat="server" Value="receiver,expense_amount,cut_payment_amount,acutal_amount,bank_no,bank_name" />
<table cellpadding="" cellspacing="" border="" style=" width:800px">
<thead>
<tr>
<th></th>
<th >
序号
</th>
<th>
收款人
</th>
<th>
报销金额
</th>
<th>
扣款金额
</th>
<th>
实付金额
</th>
<th>
银行账号
</th>
<th>
开户行
</th>
</tr>
</thead>
<tbody>
<asp:Repeater ID="rptTest" runat="server">
<ItemTemplate>
<tr>
<td><asp:CheckBox runat="server" ID="ckBox" /></td>
<td><%# Container.ItemIndex+ %></td>
<td><asp:Label ID="lblReceiver" runat="server" Text='<%#Eval("receiver") %>'></asp:Label></td>
<td><asp:TextBox ID="txtExpenseAmount" runat="server" Text='<%#Eval("expense_amount") %>'></asp:TextBox></td>
<td><asp:TextBox ID="txtCutPaymentAmount" runat="server" Text='<%#Eval("cut_payment_amount") %>'></asp:TextBox></td>
<td><asp:Label ID="lblAcutalAmount" runat="server" Text='<%#Eval("acutal_amount") %>'></asp:Label></td>
<td><asp:Label ID="lblBankNo" runat="server" Text='<%#Eval("bank_no") %>'></asp:Label></td>
<td><asp:Label ID="lblBankName" runat="server" Text='<%#Eval("bank_name") %>'></asp:Label></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</tbody>
</table> <div>
<asp:Button ID="btnAddNewRow" runat="server" OnClick="btnAddNewRow_Click" Text="添加一行" />
<asp:Button ID="btnDel" runat="server" Text="删除选中行" onclick="btnDel_Click" />
</div>
</div>
</form>
</body>
</html>

后台代码:

添加一行:

protected void btnAddNewRow_Click(object sender, EventArgs e)
{
//首先,恢复数据源
DataTable dt = DefineDataTableSchema(hfRptColumns.Value);
foreach (RepeaterItem item in rptTest.Items)
{
DataRow newRow = dt.NewRow();
newRow["receiver"] = ((Label)item.FindControl("lblReceiver")).Text;
newRow["expense_amount"] = ((TextBox)item.FindControl("txtExpenseAmount")).Text;
newRow["cut_payment_amount"] = ((TextBox)item.FindControl("txtCutPaymentAmount")).Text;
newRow["acutal_amount"] = ((Label)item.FindControl("lblAcutalAmount")).Text;
newRow["bank_no"] = ((Label)item.FindControl("lblBankNo")).Text;
newRow["bank_name"] = ((Label)item.FindControl("lblBankName")).Text;
dt.Rows.Add(newRow);
} //添加一行
DataRow row = dt.NewRow();
dt.Rows.Add(row);
rptTest.DataSource = dt;
rptTest.DataBind();
}

删除一行

protected void btnDel_Click(object sender, EventArgs e)
{
var arr = new System.Collections.ArrayList();
DataTable dt = DefineDataTableSchema(hfRptColumns.Value);
foreach (RepeaterItem item in rptTest.Items)
{
var chk = item.FindControl("ckBox") as CheckBox;
if (chk.Checked) continue; DataRow newRow = dt.NewRow();
newRow["receiver"] = ((Label)item.FindControl("lblReceiver")).Text;
newRow["expense_amount"] = ((TextBox)item.FindControl("txtExpenseAmount")).Text;
newRow["cut_payment_amount"] = ((TextBox)item.FindControl("txtCutPaymentAmount")).Text;
newRow["acutal_amount"] = ((Label)item.FindControl("lblAcutalAmount")).Text;
newRow["bank_no"] = ((Label)item.FindControl("lblBankNo")).Text;
newRow["bank_name"] = ((Label)item.FindControl("lblBankName")).Text;
dt.Rows.Add(newRow);
} rptTest.DataSource = dt;
rptTest.DataBind();
}

因为Repeater是服务端控件,所以用它动态增加或删除一行会刷新页面。用户体验远没有用 knockoutjs 绑定的效果好

附:代码下载

Repeater 动态增加删除一行的更多相关文章

  1. JS动态增加删除UL节点LI

    JS如何动态增加删除UL节点LI及相关内容. <ul id="ul"> <li id=1>11111111111111111<a href=" ...

  2. Hadoop 2.6.3动态增加/删除DataNode节点

    假设集群操作系统均为:CentOS 6.7 x64 Hadoop版本为:2.6.3 一.动态增加DataNode 1.准备新的DataNode节点机器,配置SSH互信,可以直接复制已有DataNode ...

  3. jquery动态加入删除一行数据

    <html> <head> <title>加入.删除一行</title> <meta http-equiv="content-type& ...

  4. wpf动态增加删除控件

    我在xaml中定义了一个名字为morepictureWrapPan为WrapPanel,然后将控件添加在此WrapPanel中.由于要实现控件的删除功能,所以增加的textbox和button的名字都 ...

  5. jquery validate 动态增加删除验证规则(转载)

    页面加载完成初始化form validate $("#user_regForm").validate({ errorPlacement: function(error, eleme ...

  6. jquery validate 动态增加删除验证规则

    增加规则示例: $('.class').rules('add',{ required: true, messages:{ required: '这是必填,请填写', } }); 删除规则示例: $(' ...

  7. table动态增加删除

    基于网上代码修改实现动态添加表数据行 <!DOCTYPE html> <html lang="cn"> <html> <head> ...

  8. JQuery动态增加删除元素

    <form action="" method="post" enctype="multipart/form-data"> < ...

  9. MVC中用jQuery加BootStrap实现动态增加删除文本输入框!

    http://www.freejs.net/article_biaodan_278.html 这是在网上找到方法,我修改了一下实合我的项目,发博只为收藏记录并加深记忆. 修改后效果如下 @model ...

随机推荐

  1. 我记录综合系统学习研究之用户管理五(如何利用wojilu打造一个全新的SNS应用)

    wojilu框架特别适合快速开发多用户分享内容应用,比如知乎,digg这类应用. 对于博客等用户程序,要有4个入口:1)用户展示入口(展示自己的应用) 2)用户后台管理入口(管理自己的应用) 3)聚合 ...

  2. 一步一步写一个简单通用的makefile(三)

    上一篇一步一步写一个简单通用的makefile(二) 里面的makefile 实现对通用的代码进行编译,这一章我将会对上一次的makefile 进行进一步的优化. 优化后的makefile: #Hel ...

  3. HW4.23

    public class Solution { public static void main(String[] args) { double sum = 0; for(int i = 1; i &l ...

  4. 一起来说 Vim 语

    作为一款古老而具有持久生命力的编辑器,vim 自有它的强大之处.很多人觉得 Vim 的学习曲线太陡峭了,为了能够把 Vim 用得风生水起,不得不记忆大量的命令.如果你是 Vim 新手,刚入门就开始面对 ...

  5. Rotating Scoreboard - POJ 3335(半面相交求多边形内核)

    题目大意:RT 分析:所谓内核可以理解为在多边形内存在点可以在这个点上看到多边形内部所有的部分,当然怎么求出来就是问题的关键了.我们知道多边形的每条边都是边界值,边的左边和右边肯定是一部分属于多边形一 ...

  6. uva 1030 - Image Is Everything(迭代更新)

    题目链接:uva 1030 - Image Is Everything 题目大意:有一个最大为n*n*n的立方体的一个不规整立体,由若干个1*1*1的小正方体构成(每一个小正方体被涂成不同的颜色),给 ...

  7. SSH返回Json格式的数据

      在开发中我们经常遇到客户端和后台数据的交互,使用比较多的就是json格式了.在这里以简单的Demo总结两种ssh返回Json格式的数据 项目目录如下 主要是看 上图选择的部分 WebRoot里面就 ...

  8. [Webpack 2] Grouping vendor files with the Webpack CommonsChunkPlugin

    Often, you have dependencies which you rarely change. In these cases, you can leverage the CommonsCh ...

  9. Android 完美退出 App (Exit)

    最近两天为了解决Android上面退出程序问题折腾了半死,在google & baidu 上面找了很久.很久出来的完全千篇一律,说的方法有三,但是经过我试验后全部不行. 三个方法分别是: ki ...

  10. 两款Mac下的视频下载利器

    1 iSkysoft iTube Studio 2.jaksta mac