注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

_

_

 
 
 

日志

 
 

GridView动态增加行  

2014-09-17 03:03:56|  分类: 默认分类 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
GridView动态增加行

2011-04-02 14:39:20|? 分类: asp.NET |? 标签:asp table row gridview1 textbox |举报 |字号大中小 订阅

很多时候,我们需要可编辑的表格,来比较方便的进行数据的录入,比如学习成绩的录入。当然这就要求能够动态的增加行,来一次性录入多个学生的信息。现在用ASP.NET中强大的GridView控件就能够达到这样的效果,如下图:

GridView动态增加行 - 灵心 - 小城堡

下面是具体实现

前台代码:

<%@ Page Language="C#" AutoEventWireup="true"? CodeFile="Default.aspx.cs" Inherits="_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>GridView中实现动态动态增加删除行</title>
??? <style type="text/css">
??????? .hide{
??????????? display:none;??
???????? }
??? </style>
??? <script type="text/javascript">
??????? //选中所有行
??????? function SelectAll(chkAll)
??????? {
??????????? var gridview = document.getElementById("GridView1");
??????????? if (gridview)
??????????? {
?????????????? //获取到GridView1中的所有input标签
?????????????? var inputs = gridview.getElementsByTagName("input");
?????????????? for(var i=0;i<inputs.length;i++)
?????????????? {
????????????????? if (inputs[i].type=="checkbox")
????????????????? {
???????????????????? //设置所有checkbox的选中状态与chkAll一致
???????????????????? inputs[i].checked = chkAll.checked;
????????????????? }
?????????????? }
??????????? }
?????? }
?????? //给选中行换背景色
?????? function checkRow(chkRow)
?????? {
????????? var row = chkRow.parentNode.parentNode;
????????? if(row)
????????? {
?????????????? if (chkRow.checked)
?????????????????? row.style.backgroundColor="#7799CC";
??????????????? else
?????????????????? row.style.backgroundColor="#FFFFFF";
?????????? }
?????? }
??? </script>
</head>
<body>
??? <form id="form1" runat="server">
?? <div>
?????? <asp:LinkButton ID="lbtnAddRow" runat="server" Width="80px" OnClick="lbtnAddRow_Click">添加行</asp:LinkButton>
????? <asp:LinkButton ID="btnDeleteRow" runat="server" OnClick="btnDeleteRow_Click" OnClientClick="return confirm('确定要删除选中行吗?');">删除选中行</asp:LinkButton>
?? </div>
??? <div>
??????? <asp:GridView ID="GridView1" runat="server"? AutoGenerateColumns="False" CellPadding="4" ForeColor="#333333">
??????????? <Columns>
??????????????? <asp:BoundField DataField="ID" HeaderText="ID" >
??????????????????? <ItemStyle CssClass="hide" BorderColor="#507CD1" />
??????????????????? <HeaderStyle CssClass="hide" />
??????????????? </asp:BoundField>
??????????????? <asp:TemplateField HeaderText="序号">
??????????????????? <ItemTemplate>
??????????????????????? <%# Container.DataItemIndex + 1%>
??????????????????? </ItemTemplate>
??????????????????? <ItemStyle BorderColor="#507CD1" HorizontalAlign="Center" BorderWidth="1px" />
??????????????? </asp:TemplateField>
??????????????? <asp:TemplateField>
??????????????????? <HeaderTemplate>
?????????????????????? <input id="chkAll" type="checkbox" onclick="SelectAll(this)" />
??????????????????? </HeaderTemplate>
??????????????????? <ItemTemplate>
??????????????????????? <input id="chkRow" type="checkbox" onclick="checkRow(this);" runat="server" />
??????????????????? </ItemTemplate>
??????????????????? <ItemStyle Width="30px" HorizontalAlign="Center" BorderColor="#507CD1" BorderWidth="1px" />
??????????????? </asp:TemplateField>
??????????????? <asp:TemplateField HeaderText="姓名">
??????????????????? <ItemTemplate>
??????????????????????? <asp:TextBox ID="txtName" runat="server" Text='<%# Bind("Name") %>' BorderStyle="None"></asp:TextBox>
??????????????????? </ItemTemplate>
??????????????????? <ItemStyle Width="100px" BorderColor="#507CD1" BorderWidth="1px" />
??????????????? </asp:TemplateField>
??????????????? <asp:TemplateField HeaderText="平时成绩">
??????????????????? <ItemTemplate>
??????????????????????? <asp:TextBox ID="txtUsuallyResults" runat="server" Text='<%# Bind("UsuallyResults") %>' BorderStyle="None"></asp:TextBox>
??????????????????? </ItemTemplate>
??????????????????? <ItemStyle Width="100px" BorderColor="#507CD1" BorderWidth="1px" />
??????????????? </asp:TemplateField>
??????????????? <asp:TemplateField HeaderText="考试成绩">
??????????????????? <ItemTemplate>
??????????????????????? <asp:TextBox ID="txtExamResults" runat="server" Text='<%# Bind("ExamResults") %>' BorderStyle="None"></asp:TextBox>
??????????????????? </ItemTemplate>
??????????????????? <ItemStyle Width="100px" BorderColor="#507CD1" BorderWidth="1px" />
??????????????? </asp:TemplateField>
??????????? </Columns>
??????????? <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
??????? </asp:GridView>
??? </div>
??? </form>
</body>
</html>

后台代码:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
{
??? protected void Page_Load(object sender, EventArgs e)
??? {
??????? if (!Page.IsPostBack)
??????? {
??????????? DataTable table = new DataTable();
??????????? table.Columns.Add(new DataColumn("ID"));
??????????? table.Columns.Add(new DataColumn("Name"));
??????????? table.Columns.Add(new DataColumn("UsuallyResults"));
??????????? table.Columns.Add(new DataColumn("ExamResults"));
??????????? DataRow row = table.NewRow(); table.Rows.Add(row);
??????????? GridView1.DataSource = table; GridView1.DataBind();
??????? }
??? }
??? protected void lbtnAddRow_Click(object sender, EventArgs e)
??? {
??????? DataTable table = GetGridViewData();
??????? DataRow newRow = table.NewRow();
??????? newRow["ID"] = Guid.NewGuid().ToString();
??????? table.Rows.Add(newRow);
??????? GridView1.DataSource = table;
??????? GridView1.DataBind();
??? }
??? private DataTable GetGridViewData()
??? {
??????? DataTable table = new DataTable();
??????? table.Columns.Add(new DataColumn("ID"));
??????? table.Columns.Add(new DataColumn("Name"));
??????? table.Columns.Add(new DataColumn("UsuallyResults"));
??????? table.Columns.Add(new DataColumn("ExamResults"));
??????? foreach (GridViewRow row in GridView1.Rows)
??????? {
??????????? DataRow sourseRow = table.NewRow();
??????????? sourseRow["ID"] = row.Cells[0].Text;
??????????? sourseRow["Name"] = ((TextBox)row.Cells[3].FindControl("txtName")).Text;
??????????? sourseRow["UsuallyResults"] = ((TextBox)row.Cells[4].FindControl("txtUsuallyResults")).Text;
??????????? sourseRow["ExamResults"] = ((TextBox)row.Cells[5].FindControl("txtExamResults")).Text;
??????????? table.Rows.Add(sourseRow);
??????? }
??????? return table;
??? }
??? protected void btnDeleteRow_Click(object sender, EventArgs e)
??? {
??????? DataTable table = GetGridViewData();
??????? foreach (GridViewRow row in GridView1.Rows)
??????? {
??????????? if (((HtmlInputCheckBox)row.Cells[2].FindControl("chkRow")).Checked)
??????????? {
??????????????? foreach (DataRow dtRow in table.Rows)
??????????????? {
??????????????????? if (dtRow["ID"].ToString() == row.Cells[0].Text)
??????????????????? {
??????????????????????? table.Rows.Remove(dtRow);
??????????????????????? break;
??????????????????? }
??????????????? }
??????????? }
??????? }
??????? GridView1.DataSource = table;
??????? GridView1.DataBind();
??? }
}

  评论这张
 
阅读(251)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017