在本例,我们要完成的工作主要有如下,当然,我得重申,这些都只是针对GridView控件,这其中也会使用到SqlDataSource控件,事实上在我们日常的使用中,GridView控件也总是需要起数据源控件的支持!
下面开始我们的GridView控件使用之高级技巧
1:添加移除列 2:改列头名 3:将某列设置特殊格式
4:增加鼠标动作 5:为特定的数改变行样式 6:客户端隐藏示特定的列
7:使用图片列做易图片集 8:一次更新所记录 9:改变编辑模式下文本框的长度
10:在GridView之外的地方显当前控件显示的页码 11:使用控件做查询条件
都这么久在找到空间放视频,实在不好意思哈!呵呵
视频下载地址是 http://spacenet.supericp.com/thc/gridview.rar 感谢老虎学画画提供空间
完整代码下载地址 https://files.cnblogs.com/thcjp/GridView.rar
在本例,我们要完成的工作主要有如下,当然,我得重申,这些都只是针对GridView控件,这其中也会使用到SqlDataSource控件,事实上在我们日常的使用中,GridView控件也总是需要起数据源控件的支持!
下面开始我们的GridView控件使用之高级技巧
还是老习惯,直接看代码
接下来的代码是 小例 7 和 8 的,因为这个使用的是DateSet做数据源,所以单独做的
但是一篇贴不完,所以单独贴了一篇,地址是
http://thcjp.cnblogs.com/archive/2006/06/04/416911.html
视频下载地址是 http://spacenet.supericp.com/thc/gridview.rar 感谢老虎学画画提供空间
完整代码下载地址 https://files.cnblogs.com/thcjp/GridView.rar
在本例,我们要完成的工作主要有如下,当然,我得重申,这些都只是针对GridView控件,这其中也会使用到SqlDataSource控件,事实上在我们日常的使用中,GridView控件也总是需要起数据源控件的支持!
下面开始我们的GridView控件使用之高级技巧
1:添加移除列 | 2:改列头名 | 3:将某列设置特殊格式 | |
4:增加鼠标动作 | 5:为特定的数改变行样式 | 6:客户端隐藏示特定的列 | |
7:使用图片列做易图片集 | 8:一次更新所记录 | 9:改变编辑模式下文本框的长度 | |
10:在GridView之外的地方显当前控件显示的页码 | 11:使用控件做查询条件 |
还是老习惯,直接看代码
前台HTML代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default1.aspx.cs" Inherits="Default1" %>
<!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>
1:添加移除列<br />
<br />
假设我们认为你已经看过我上个关于GridView的基础教程,这里我们就直接先拖一个GridView控件近来,并做好初步的设置!<br />
现在我们看到,基本已经设置完了,这里我们看到,基础已经算好了,下面我们就为他先删一个列吧,然后再增加,这样就完成这个小节,好了,大家应该看到上面我们把添删移动都做了,很简单吧!<br />
<br />
下面我们做 :<strong>2:改列头名<br />
<br />
</strong>本来是无聊,大家应该看到,在我们启用排序后,直接点标头就可以的了,呵呵,顺便提下<br />
<br />
再下面做 :<strong>3:将某列设置特殊格式<br />
<br />
</strong>我们就把邮编设置下吧,看好了,看到了吧,我刚才设置错了,开始设置那个是单元格内控件的,而后面这次设置的才是列的样式,再看下<br />
<br />
<strong>4:增加鼠标动作<br />
<br />
</strong>看见了吧,当我们鼠标悬停的时候他的背景色就改变了,其实这个是VS2003的时候就可以,只是当时使用的好象是ItemDataBound,记不实在了,嘿嘿<br />
<br />
<strong>5:为特定的数改变行样式<br />
<br />
</strong>我们先看下里面的数据,就BB吧,大家看见了吧,state列值为BB的两列的背景色已经改变了,这个用在那里不需要我说了撒,呵呵<br />
<br />
<strong>6:客户端隐藏示特定的列</strong><br />
<br />
这个以前VS2003也有,不过有点不同了,不浪费时间,直接看吧<br />
<br />
<strong>9:改变编辑模式下文本框的长度<br />
<br />
</strong>在做之前呢我们先看下现在的丑样,看见了吧,一切换到编辑,他就把格子弄坏了,我们改下,以前2003的DataGrid我也做过相关的,但是那个真的很麻烦,有兴趣的朋友可以在我Blogs,看下http://thcjp.cnblogs.com/archive/2006/05/01/390244.html
这个<br />
<br />
看见了吧,当我们把每个控件的宽度都设置固定的话,他也就没办法乱整了,呵呵,对了,如果你不明白为什么ID列没被编辑的话,我想告诉你,因为这个作为主键是不允许被编辑的,当然,你也可以编辑,只是将该列的只读属性去掉<br />
<br />
<strong>10:在GridView之外的地方显当前控件显示的页码<br />
<br />
</strong>怎么样,这个很简单吧,呵呵<br />
<br />
<strong>11:使用控件做查询条件<br />
<br />
</strong>看见没有,这里我们先设置一个DropDownList控件,然后设置他的数据源,让他只返回数据库的唯一项,意思是数据库里的某列如果有重复的数据,那么他只显示一次<br />
<br />
下面我们还得设置GridView的查询条件,否则是不成功的,设置完了,我们看下,怎么样,简单吧!<br />
<br />
哎呀,怎么都5M多了,不行,另外两个得重新开动画做,因为那两个有点麻烦,呵呵,<br />
<br />
如果你只下载了这个,没有下到 GridView基础使用以及后面的教程的话请关注<br />
http://thcjp.cnblogs.com/<br />
<br />
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" DataSourceID="SqlDataSource2"
DataTextField="state" DataValueField="state">
</asp:DropDownList><asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:pubsConnectionString %>"
SelectCommand="SELECT DISTINCT [state] FROM [authors]"></asp:SqlDataSource>
<br />
<br />
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True"
AutoGenerateColumns="False" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None"
BorderWidth="1px" CellPadding="3" DataKeyNames="au_id" DataSourceID="SqlDataSource1"
OnRowDataBound="GridView1_RowDataBound">
<FooterStyle BackColor="White" ForeColor="#000066" />
<Columns>
<asp:CommandField HeaderText="操作" ShowEditButton="True" />
<asp:BoundField DataField="au_id" HeaderText="ID" ReadOnly="True" SortExpression="au_id" />
<asp:BoundField DataField="au_lname" HeaderText="名字" SortExpression="au_lname">
<ControlStyle Width="60px" />
</asp:BoundField>
<asp:BoundField DataField="city" HeaderText="城市" SortExpression="city">
<ControlStyle Width="60px" />
</asp:BoundField>
<asp:BoundField DataField="state" HeaderText="不知道" SortExpression="state">
<ControlStyle Width="60px" />
</asp:BoundField>
<asp:BoundField DataField="zip" DataFormatString="{0:c}" HeaderText="邮编" SortExpression="zip">
<ControlStyle BackColor="#FFFFC0" BorderColor="#C0FFFF" BorderStyle="Solid" BorderWidth="1px"
Font-Bold="True" Width="60px" />
<ItemStyle BackColor="#FF8080" BorderStyle="Solid" Font-Bold="True" />
</asp:BoundField>
</Columns>
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:pubsConnectionString %>"
DeleteCommand="DELETE FROM [authors] WHERE [au_id] = @au_id" InsertCommand="INSERT INTO [authors] ([au_id], [au_lname], [city], [state], [zip]) VALUES (@au_id, @au_lname, @city, @state, @zip)"
SelectCommand="SELECT [au_id], [au_lname], [city], [state], [zip] FROM [authors] WHERE ([state] = @state)"
UpdateCommand="UPDATE [authors] SET [au_lname] = @au_lname, [city] = @city, [state] = @state, [zip] = @zip WHERE [au_id] = @au_id">
<DeleteParameters>
<asp:Parameter Name="au_id" Type="String" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="au_lname" Type="String" />
<asp:Parameter Name="city" Type="String" />
<asp:Parameter Name="state" Type="String" />
<asp:Parameter Name="zip" Type="String" />
<asp:Parameter Name="au_id" Type="String" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="au_id" Type="String" />
<asp:Parameter Name="au_lname" Type="String" />
<asp:Parameter Name="city" Type="String" />
<asp:Parameter Name="state" Type="String" />
<asp:Parameter Name="zip" Type="String" />
</InsertParameters>
<SelectParameters>
<asp:ControlParameter ControlID="DropDownList1" Name="state" PropertyName="SelectedValue"
Type="String" />
</SelectParameters>
</asp:SqlDataSource>
<br />
共<asp:Label ID="Label1" runat="server" Text="Label"><%=GridView1.PageCount %></asp:Label>页,当前在
<asp:Label ID="Label2" runat="server" Text="Label"><%=GridView1.PageIndex+1 %></asp:Label>页<br />
<br />
<asp:TextBox ID="TextBox1" runat="server" Width="55px"></asp:TextBox>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="隐藏" />
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="显示全部被隐藏的" /><br />
注意哦,上面文本框只能输入数字,这里本来可以用验证控件的了,但是还没学就不用。提示下就成了 ,既然做了隐藏,那总还得显示出来撒,简单,看好了哈!</div>
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default1.aspx.cs" Inherits="Default1" %>
<!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>
1:添加移除列<br />
<br />
假设我们认为你已经看过我上个关于GridView的基础教程,这里我们就直接先拖一个GridView控件近来,并做好初步的设置!<br />
现在我们看到,基本已经设置完了,这里我们看到,基础已经算好了,下面我们就为他先删一个列吧,然后再增加,这样就完成这个小节,好了,大家应该看到上面我们把添删移动都做了,很简单吧!<br />
<br />
下面我们做 :<strong>2:改列头名<br />
<br />
</strong>本来是无聊,大家应该看到,在我们启用排序后,直接点标头就可以的了,呵呵,顺便提下<br />
<br />
再下面做 :<strong>3:将某列设置特殊格式<br />
<br />
</strong>我们就把邮编设置下吧,看好了,看到了吧,我刚才设置错了,开始设置那个是单元格内控件的,而后面这次设置的才是列的样式,再看下<br />
<br />
<strong>4:增加鼠标动作<br />
<br />
</strong>看见了吧,当我们鼠标悬停的时候他的背景色就改变了,其实这个是VS2003的时候就可以,只是当时使用的好象是ItemDataBound,记不实在了,嘿嘿<br />
<br />
<strong>5:为特定的数改变行样式<br />
<br />
</strong>我们先看下里面的数据,就BB吧,大家看见了吧,state列值为BB的两列的背景色已经改变了,这个用在那里不需要我说了撒,呵呵<br />
<br />
<strong>6:客户端隐藏示特定的列</strong><br />
<br />
这个以前VS2003也有,不过有点不同了,不浪费时间,直接看吧<br />
<br />
<strong>9:改变编辑模式下文本框的长度<br />
<br />
</strong>在做之前呢我们先看下现在的丑样,看见了吧,一切换到编辑,他就把格子弄坏了,我们改下,以前2003的DataGrid我也做过相关的,但是那个真的很麻烦,有兴趣的朋友可以在我Blogs,看下http://thcjp.cnblogs.com/archive/2006/05/01/390244.html
这个<br />
<br />
看见了吧,当我们把每个控件的宽度都设置固定的话,他也就没办法乱整了,呵呵,对了,如果你不明白为什么ID列没被编辑的话,我想告诉你,因为这个作为主键是不允许被编辑的,当然,你也可以编辑,只是将该列的只读属性去掉<br />
<br />
<strong>10:在GridView之外的地方显当前控件显示的页码<br />
<br />
</strong>怎么样,这个很简单吧,呵呵<br />
<br />
<strong>11:使用控件做查询条件<br />
<br />
</strong>看见没有,这里我们先设置一个DropDownList控件,然后设置他的数据源,让他只返回数据库的唯一项,意思是数据库里的某列如果有重复的数据,那么他只显示一次<br />
<br />
下面我们还得设置GridView的查询条件,否则是不成功的,设置完了,我们看下,怎么样,简单吧!<br />
<br />
哎呀,怎么都5M多了,不行,另外两个得重新开动画做,因为那两个有点麻烦,呵呵,<br />
<br />
如果你只下载了这个,没有下到 GridView基础使用以及后面的教程的话请关注<br />
http://thcjp.cnblogs.com/<br />
<br />
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" DataSourceID="SqlDataSource2"
DataTextField="state" DataValueField="state">
</asp:DropDownList><asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:pubsConnectionString %>"
SelectCommand="SELECT DISTINCT [state] FROM [authors]"></asp:SqlDataSource>
<br />
<br />
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True"
AutoGenerateColumns="False" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None"
BorderWidth="1px" CellPadding="3" DataKeyNames="au_id" DataSourceID="SqlDataSource1"
OnRowDataBound="GridView1_RowDataBound">
<FooterStyle BackColor="White" ForeColor="#000066" />
<Columns>
<asp:CommandField HeaderText="操作" ShowEditButton="True" />
<asp:BoundField DataField="au_id" HeaderText="ID" ReadOnly="True" SortExpression="au_id" />
<asp:BoundField DataField="au_lname" HeaderText="名字" SortExpression="au_lname">
<ControlStyle Width="60px" />
</asp:BoundField>
<asp:BoundField DataField="city" HeaderText="城市" SortExpression="city">
<ControlStyle Width="60px" />
</asp:BoundField>
<asp:BoundField DataField="state" HeaderText="不知道" SortExpression="state">
<ControlStyle Width="60px" />
</asp:BoundField>
<asp:BoundField DataField="zip" DataFormatString="{0:c}" HeaderText="邮编" SortExpression="zip">
<ControlStyle BackColor="#FFFFC0" BorderColor="#C0FFFF" BorderStyle="Solid" BorderWidth="1px"
Font-Bold="True" Width="60px" />
<ItemStyle BackColor="#FF8080" BorderStyle="Solid" Font-Bold="True" />
</asp:BoundField>
</Columns>
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:pubsConnectionString %>"
DeleteCommand="DELETE FROM [authors] WHERE [au_id] = @au_id" InsertCommand="INSERT INTO [authors] ([au_id], [au_lname], [city], [state], [zip]) VALUES (@au_id, @au_lname, @city, @state, @zip)"
SelectCommand="SELECT [au_id], [au_lname], [city], [state], [zip] FROM [authors] WHERE ([state] = @state)"
UpdateCommand="UPDATE [authors] SET [au_lname] = @au_lname, [city] = @city, [state] = @state, [zip] = @zip WHERE [au_id] = @au_id">
<DeleteParameters>
<asp:Parameter Name="au_id" Type="String" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="au_lname" Type="String" />
<asp:Parameter Name="city" Type="String" />
<asp:Parameter Name="state" Type="String" />
<asp:Parameter Name="zip" Type="String" />
<asp:Parameter Name="au_id" Type="String" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="au_id" Type="String" />
<asp:Parameter Name="au_lname" Type="String" />
<asp:Parameter Name="city" Type="String" />
<asp:Parameter Name="state" Type="String" />
<asp:Parameter Name="zip" Type="String" />
</InsertParameters>
<SelectParameters>
<asp:ControlParameter ControlID="DropDownList1" Name="state" PropertyName="SelectedValue"
Type="String" />
</SelectParameters>
</asp:SqlDataSource>
<br />
共<asp:Label ID="Label1" runat="server" Text="Label"><%=GridView1.PageCount %></asp:Label>页,当前在
<asp:Label ID="Label2" runat="server" Text="Label"><%=GridView1.PageIndex+1 %></asp:Label>页<br />
<br />
<asp:TextBox ID="TextBox1" runat="server" Width="55px"></asp:TextBox>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="隐藏" />
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="显示全部被隐藏的" /><br />
注意哦,上面文本框只能输入数字,这里本来可以用验证控件的了,但是还没学就不用。提示下就成了 ,既然做了隐藏,那总还得显示出来撒,简单,看好了哈!</div>
</form>
</body>
</html>
后台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;
//因为要使用颜色,所以我们得引入命名空间
using System.Drawing;
public partial class Default1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{//我们先设置当鼠标上去的时候他的背景色改变
e.Row.Attributes.Add("onmouseover", "c=this.style.backgroundColor;this.style.backgroundColor='#ff6699'");
//下面我们再设置当鼠标离开后背景色再还原
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c;");
//为特定的数改变行样式这也是在这个事件里面,因为这个事件是在数据被绑定的时候执行的
for (int i = 0; i < GridView1.Rows.Count; i++)
{ //为了对全部数据行都有用,我们使用循环
string lbl = Convert.ToString(DataBinder.Eval(e.Row.DataItem,"state"));//我们得取出行中state字段绑定的值,用他作为判断条件
if (lbl == "BB")
{ //如果他的值等于BB,那么
e.Row.BackColor = Color.LimeGreen;//给当前行的背景色赋值,说心理话,微软这点没DW做得好,人家就是直观得好
}
}
}
protected void Button1_Click(object sender, EventArgs e)
{//隐藏特定的列
int r = int.Parse(TextBox1.Text);
GridView1.Columns[r].Visible = false;
}
protected void Button2_Click(object sender, EventArgs e)
{//显示全部被隐藏的列
for (int j = 0; j < GridView1.Columns.Count; j++)
{//循环所有的列,然后检察属性是否是否,如果是就改变成是就可以了
if (GridView1.Columns[j].Visible == false)//刚才错在判断这里了,呵呵
{
GridView1.Columns[j].Visible = true;
}
}
}
}
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;
//因为要使用颜色,所以我们得引入命名空间
using System.Drawing;
public partial class Default1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{//我们先设置当鼠标上去的时候他的背景色改变
e.Row.Attributes.Add("onmouseover", "c=this.style.backgroundColor;this.style.backgroundColor='#ff6699'");
//下面我们再设置当鼠标离开后背景色再还原
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c;");
//为特定的数改变行样式这也是在这个事件里面,因为这个事件是在数据被绑定的时候执行的
for (int i = 0; i < GridView1.Rows.Count; i++)
{ //为了对全部数据行都有用,我们使用循环
string lbl = Convert.ToString(DataBinder.Eval(e.Row.DataItem,"state"));//我们得取出行中state字段绑定的值,用他作为判断条件
if (lbl == "BB")
{ //如果他的值等于BB,那么
e.Row.BackColor = Color.LimeGreen;//给当前行的背景色赋值,说心理话,微软这点没DW做得好,人家就是直观得好
}
}
}
protected void Button1_Click(object sender, EventArgs e)
{//隐藏特定的列
int r = int.Parse(TextBox1.Text);
GridView1.Columns[r].Visible = false;
}
protected void Button2_Click(object sender, EventArgs e)
{//显示全部被隐藏的列
for (int j = 0; j < GridView1.Columns.Count; j++)
{//循环所有的列,然后检察属性是否是否,如果是就改变成是就可以了
if (GridView1.Columns[j].Visible == false)//刚才错在判断这里了,呵呵
{
GridView1.Columns[j].Visible = true;
}
}
}
}
接下来的代码是 小例 7 和 8 的,因为这个使用的是DateSet做数据源,所以单独做的
但是一篇贴不完,所以单独贴了一篇,地址是
http://thcjp.cnblogs.com/archive/2006/06/04/416911.html