视频下载地址是 http://spacenet.supericp.com/thc/gridview.rar 感谢老虎学画画提供空间
昨天晚上还没有做完 7 和 8 两个小演示,觉得放首页恐怕不好,现在都补齐了!因为上一篇基础的东西太多,而这篇我觉得放首页还是可以,如果DUDU审下有问题,麻烦帮我放新手就是(老是缺乏自信)
完整代码下载地址 https://files.cnblogs.com/thcjp/GridView.rar
在本例,我们要完成的工作主要有如下,当然,我得重申,这些都只是针对GridView控件,这其中也会使用到SqlDataSource控件,事实上在我们日常的使用中,GridView控件也总是需要起数据源控件的支持!
下面开始我们的GridView控件使用之高级技巧
1:添加移除列 | 2:改列头名 | 3:将某列设置特殊格式 | |
4:增加鼠标动作 | 5:为特定的数改变行样式 | 6:客户端隐藏示特定的列 | |
7:使用图片列做易图片集 | 8:一次更新所记录 | 9:改变编辑模式下文本框的长度 | |
10:在GridView之外的地方显当前控件显示的页码 | 11:使用控件做查询条件 |
由于一篇贴不完,所以新开一篇。上篇地址是http://thcjp.cnblogs.com/archive/2006/06/03/416679.html
接下来的代码是 小例 7 和 8 的,因为这个使用的是DateSet做数据源,所以单独做的
7、8小例的前台HTML代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!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>
习惯,我们还是先拖一个控件到网页上来,下面,我直接复制先写好的建立DataSet的代码,因为现在写的话太浪费时间了:<br />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="id" HeaderText="ID" />
<asp:BoundField DataField="name" HeaderText="名字" />
<asp:BoundField DataField="dtt" HeaderText="时间" />
<asp:BoundField DataField="url" HeaderText="图片路径" />
<asp:ImageField DataImageUrlField="url" HeaderText="图片">
</asp:ImageField>
</Columns>
</asp:GridView>
<br />
<br />
现在我们可以看下了,呵呵,看到了,那么到这里,我们的制作简易相册算完了,<br />
下面做批量修改记录了,我们重新建立一个GridView,这样看起来容易点<br />
<br />
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" BackColor="White"
BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px" CellPadding="4">
<FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
<Columns>
<asp:BoundField DataField="id" HeaderText="ID" />
<asp:TemplateField HeaderText="名字">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("name") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:TextBox ID="gname" runat="server" Text='<%# Bind("name") %>' Width="67px"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="时间">
<EditItemTemplate>
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("dtt") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("dtt") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="图片">
<EditItemTemplate>
<asp:TextBox ID="TextBox3" runat="server" Text='<%# Eval("url") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("url") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<RowStyle BackColor="White" ForeColor="#330099" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />
<PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" />
</asp:GridView>
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="更新" Width="290px" /><br />
<br />
至此,全部完了,有什么不清楚的可以跟我交流,你们应该能看出来,我也不是高手,呵呵,大家一起交流,共同进步了!! 我QQ 110535808</div>
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!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>
习惯,我们还是先拖一个控件到网页上来,下面,我直接复制先写好的建立DataSet的代码,因为现在写的话太浪费时间了:<br />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="id" HeaderText="ID" />
<asp:BoundField DataField="name" HeaderText="名字" />
<asp:BoundField DataField="dtt" HeaderText="时间" />
<asp:BoundField DataField="url" HeaderText="图片路径" />
<asp:ImageField DataImageUrlField="url" HeaderText="图片">
</asp:ImageField>
</Columns>
</asp:GridView>
<br />
<br />
现在我们可以看下了,呵呵,看到了,那么到这里,我们的制作简易相册算完了,<br />
下面做批量修改记录了,我们重新建立一个GridView,这样看起来容易点<br />
<br />
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" BackColor="White"
BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px" CellPadding="4">
<FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
<Columns>
<asp:BoundField DataField="id" HeaderText="ID" />
<asp:TemplateField HeaderText="名字">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("name") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:TextBox ID="gname" runat="server" Text='<%# Bind("name") %>' Width="67px"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="时间">
<EditItemTemplate>
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("dtt") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("dtt") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="图片">
<EditItemTemplate>
<asp:TextBox ID="TextBox3" runat="server" Text='<%# Eval("url") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("url") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<RowStyle BackColor="White" ForeColor="#330099" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />
<PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" />
</asp:GridView>
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="更新" Width="290px" /><br />
<br />
至此,全部完了,有什么不清楚的可以跟我交流,你们应该能看出来,我也不是高手,呵呵,大家一起交流,共同进步了!! 我QQ 110535808</div>
</form>
</body>
</html>
7、8小例的后台CS代码
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{//当页面载入的时候建立表
if (!IsPostBack)
{
DataSet ds = new DataSet("gv");//NEW一个标视为 gv的库
DataTable dt = new DataTable("logoo");//为上面的库建立一个标视为logoo的数据表
dt.Columns.Add(new DataColumn("id", typeof(int)));//建立新的数据列, 类型为int,列名为id的数据列
dt.Columns.Add(new DataColumn("name", typeof(string)));
dt.Columns.Add(new DataColumn("url", typeof(string)));
dt.Columns.Add(new DataColumn("dtt", typeof(DateTime)));
DataRow dr = dt.NewRow();//建立一个新的数据行
dr["id"] = 1;//设置单元格数据
dr["name"] = "Logo";
dr["url"] = "~/img/2.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);//将该行添加到表里
dr = dt.NewRow();
dr["id"] = 2;
dr["name"] = "标志";
dr["url"] = "~/img/3.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["id"] = 3;
dr["name"] = "洪川";
dr["url"] = "~/img/2.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["id"] = 3;
dr["name"] = "洪川";
dr["url"] = "~/img/2.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);
ds.Tables.Add(dt);//把表添加到库里,怎么样,简单吧,呵呵
Session["ds"] = ds;//为了方便数据一直保存在内存中,我们把他放到Session中去
fill();//在这里调用方法绑定数据,下面我们看下实际的效果
}
}
private void fill()
{//我们做一个方法,来绑定数据到视图中去
DataSet ds = (DataSet)Session["ds"];//这里应该强制类型转换的,呵呵,不过现在确实还不能看,因为前面我们还没有绑定数据哦
GridView1.DataSource = ds;
GridView1.DataBind();
GridView2.DataSource = ds;
GridView2.DataBind();
}
protected void Button1_Click(object sender, EventArgs e)
{//下面我们开始对他里面的数据实行批量更改
for(int i=0;i<GridView2.Rows.Count;i++)
{
GridViewRow gvr=GridView2.Rows[i];//声明一个行对象
string lbl = ((TextBox)gvr.Cells[1].FindControl("gname")).Text.Replace("'","@_~!");//得到文本框里的数据,郁闷,肚子饿了,脑子不好用了,呵呵
if(lbl=="标志")
{//郁闷,==我看下
DataSet ds = (DataSet)Session["ds"];
ds.Tables["logoo"].Rows[i]["name"] = "洪川医药";//这里错,这应该是循环的当前行,唉
Session["ds"] = ds;//还是还给Session
fill();//重新绑定
}
}
}
}
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{//当页面载入的时候建立表
if (!IsPostBack)
{
DataSet ds = new DataSet("gv");//NEW一个标视为 gv的库
DataTable dt = new DataTable("logoo");//为上面的库建立一个标视为logoo的数据表
dt.Columns.Add(new DataColumn("id", typeof(int)));//建立新的数据列, 类型为int,列名为id的数据列
dt.Columns.Add(new DataColumn("name", typeof(string)));
dt.Columns.Add(new DataColumn("url", typeof(string)));
dt.Columns.Add(new DataColumn("dtt", typeof(DateTime)));
DataRow dr = dt.NewRow();//建立一个新的数据行
dr["id"] = 1;//设置单元格数据
dr["name"] = "Logo";
dr["url"] = "~/img/2.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);//将该行添加到表里
dr = dt.NewRow();
dr["id"] = 2;
dr["name"] = "标志";
dr["url"] = "~/img/3.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["id"] = 3;
dr["name"] = "洪川";
dr["url"] = "~/img/2.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["id"] = 3;
dr["name"] = "洪川";
dr["url"] = "~/img/2.gif";
dr["dtt"] = DateTime.Now;
dt.Rows.Add(dr);
ds.Tables.Add(dt);//把表添加到库里,怎么样,简单吧,呵呵
Session["ds"] = ds;//为了方便数据一直保存在内存中,我们把他放到Session中去
fill();//在这里调用方法绑定数据,下面我们看下实际的效果
}
}
private void fill()
{//我们做一个方法,来绑定数据到视图中去
DataSet ds = (DataSet)Session["ds"];//这里应该强制类型转换的,呵呵,不过现在确实还不能看,因为前面我们还没有绑定数据哦
GridView1.DataSource = ds;
GridView1.DataBind();
GridView2.DataSource = ds;
GridView2.DataBind();
}
protected void Button1_Click(object sender, EventArgs e)
{//下面我们开始对他里面的数据实行批量更改
for(int i=0;i<GridView2.Rows.Count;i++)
{
GridViewRow gvr=GridView2.Rows[i];//声明一个行对象
string lbl = ((TextBox)gvr.Cells[1].FindControl("gname")).Text.Replace("'","@_~!");//得到文本框里的数据,郁闷,肚子饿了,脑子不好用了,呵呵
if(lbl=="标志")
{//郁闷,==我看下
DataSet ds = (DataSet)Session["ds"];
ds.Tables["logoo"].Rows[i]["name"] = "洪川医药";//这里错,这应该是循环的当前行,唉
Session["ds"] = ds;//还是还给Session
fill();//重新绑定
}
}
}
}