GridView控件使用参考示例
众所周知Gridview控件是.NET 2.0提供的非常强大的一款数据控件，关于GridView控件的介绍在MSDN http://msdn.microsoft.com/zh-cn/library/cc295223.aspx，那么理论性的东西以及GridView的一些属性方法等我在这里就没必要啰嗦了。本文主要为第一次接触GridView控件的学习者提供一个参考示例。首先上图，看下整体显示效果。
接下来看下GridView的相关属性以及各列的设置代码如下（GridView的ID为gvMyLeave）：
View Code
<asp:GridView ID="gvMyLeave" runat="server" AutoGenerateColumns="False"
BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px"
CellPadding="3" CellSpacing="2" Width="100%"
onrowediting="gvMyLeave_RowEditing"
OnRowCancelingEdit="gvMyLeave_RowCancelingEdit" DataKeyNames="UserID"
onrowupdating="gvMyLeave_RowUpdating"
onrowdeleting="gvMyLeave_RowDeleting" AllowPaging="True" PageSize="3"
onpageindexchanging="gvMyLeave_PageIndexChanging"
onrowdatabound="gvMyLeave_RowDataBound">
<PagerSettings FirstPageText="首页" LastPageText="末页" Mode="NumericFirstLast"
NextPageText="下一页" PageButtonCount="5" PreviousPageText="上一页"/>
<RowStyle BackColor="#FFF7E7" ForeColor="#8C4510"/>
<Columns>
<asp:TemplateField HeaderText="标题">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("Title") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<%--<asp:Label ID="Label1" runat="server" Text='<%# Bind("Title") %>'></asp:Label>--%>
<a target="_blank" title="点击编辑留言" href='http://www.baidu.com?search=<%# Eval("ID") %>'><%# Eval("Title") %></a>
</ItemTemplate>
<HeaderStyle Width="150px"/>
<ItemStyle Width="200px"/>
</asp:TemplateField>
<asp:TemplateField HeaderText="内容" SortExpression="Content">
<EditItemTemplate>
<asp:TextBox ID="txtEditContent" runat="server" Text='<%# Bind("Content") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("Content") %>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="30%"/>
</asp:TemplateField>
<asp:BoundField DataField="Reply" HeaderText="回复内容" SortExpression="Reply" ReadOnly="true">
<HeaderStyle Width="25%"/>
<ItemStyle Width="30%"/>
</asp:BoundField>
<asp:BoundField DataField="CreateTime" HeaderText="留言时间"
SortExpression="CreateTime" DataFormatString="{0:yyyy年MM月dd日 hh:mm}"
ReadOnly="True">
<ItemStyle Width="150px"/>
</asp:BoundField>
<asp:CommandField ShowEditButton="True">
<ItemStyle Width="200px"/>
</asp:CommandField>
<asp:CommandField ShowDeleteButton="True"
DeleteText="<div id="de" onclick="JavaScript:return confirm('确定删除吗？')">删除</div> ">
<ItemStyle Width="90px"/>
</asp:CommandField>
</Columns>
<FooterStyle HorizontalAlign="Left" BackColor="#F7DFB5" ForeColor="#8C4510"/>
<PagerStyle ForeColor="#8C4510" HorizontalAlign="Left" Width="100px"
Wrap="true" BorderStyle="Dotted"/>
<SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="White"/>
<HeaderStyle BackColor="#A55129" Font-Bold="True" ForeColor="White"/>
</asp:GridView>
当我们对GridView控件进行数据绑定后GridView会自动为数据源生成列，我们一般不需要，所以把AutoGenerateColumns="False"，然后设置允许分页AllowPaging="True"，另外我们再设置DataKeyNames="ID"（也就是将GridView的键绑定到数据源的ID列）。
接下来我们着重学习GridView的几个重要事件：（单击”Edit时触发“）onrowediting="gvMyLeave_RowEditing" 、（单击Cancel时触发）OnRowCancelingEdit="gvMyLeave_RowCancelingEdit"、（单击Update时触发）onrowupdating="gvMyLeave_RowUpdating" 、（单击删除时触发）onrowdeleting="gvMyLeave_RowDeleting"、 （单击页码时触发）onpageindexchanging="gvMyLeave_PageIndexChanging" 、（在完成数据绑定时触发）onrowdatabound="gvMyLeave_RowDataBound"。
好了，以下是对应的后台代码，主要是演示上述各事件的写法：
View Code
publicpartialclass UserLeaveWords : System.Web.UI.Page
{
protectedvoid Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (!UserBLL.Instance.IsLogin)
{
Response.Redirect("Login.aspx");
}
bindPage();
}
}
///<summary>
/// 对页面进行数据绑定
///</summary>
void bindPage()
{
//this.gvMyLeave.DataSource = LeaveWordBLL.Instance.GetLeaveWordViewList(
// string.Format("UserID={0}", UserBLL.Instance.Current.ID), string.Empty);
this.gvMyLeave.DataSource = LeaveWordBLL.Instance.GetLeaveWordViewList();
this.gvMyLeave.DataBind();
}
protectedvoid gvMyLeave_RowEditing(object sender, GridViewEditEventArgs e)
{
//单击编辑时，显示更新和取消按钮
this.gvMyLeave.EditIndex = e.NewEditIndex;
bindPage();
}
protectedvoid gvMyLeave_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
{
//取消编辑状态
this.gvMyLeave.EditIndex =-1;
bindPage();
}
protectedvoid gvMyLeave_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
//如果要获取更新的列的Textbox的值，需要将列转换为模板页
//可用这样的方式获取
string content = (this.gvMyLeave.Rows[e.RowIndex].FindControl("txtEditContent") as TextBox).Text;
//执行更新进行提交
this.gvMyLeave.EditIndex =-1;
bindPage();
}
protectedvoid gvMyLeave_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
int id = Convert.ToInt32(this.gvMyLeave.DataKeys[e.RowIndex].Value);
//执行删除
bindPage();
}
protectedvoid gvMyLeave_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
//当GridView的页码发生改变时
this.gvMyLeave.PageIndex = e.NewPageIndex;
bindPage();
}
//设置GridView的行当鼠标经过时的颜色
protectedvoid gvMyLeave_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow && e.Row.RowType != DataControlRowType.Header)
{
e.Row.Attributes.Add("onmouseover", "this.style.backgroundColor='#cccccc'");
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor='#ffffff'");
}
}
}
代码里注释做了蛮多了，这里的话我就不解释了。
最后还有一点要说的就是在删除列添加删除前确认的脚本，我们可以设置DeleteText属性为
<div onclick="JavaScript:return confirm('确定删除吗？')">删除</div>
直接在HTML代码编写的话则为：
View Code
<asp:CommandField ShowDeleteButton="True"
DeleteText="<div id="de" onclick="JavaScript:return confirm('确定删除吗？')">删除</div> ">
<ItemStyle Width="90px"/>
</asp:CommandField>
好了，写了那么多了，但是有个不幸的消息要说的就是其实GridView控件在开发中并不实用，而且一般呢能不用尽量不用，一个原因是它生成的HTML代码非常繁琐，ViewState非常大，另一个呢就是不够灵活，难于维护，最后一点就是它让我们的前端设计师很难进行界面设计。不过反过来，如果我们很杯具的没有前端设计师的话呢用GridView控件不失为一个好的选择。
