让 Asp.NET 的 DataGrid 可排序、可选择、可分页

DataGrid 是 Asp.NET 中的一个重要的控件，经常我们都将 DataGrid 做成可分页的和可排序的，有时还需要加上选择功能。这些都是经常需要用到的方法，其实是比较简单的。

设计思路：

为了方便起见，我们连接 SQL Server 2000 的 NorthWind 数据库的 Orders 表，从数据库里得到此表的数据视图。利用 DataGrid 的 SortCommand 事件实现排序。用一个模板列加上 CheckBox 控件实现选择。可用 DataGrid 的属性生成器的“分页”选项或者自己修改 HTML 实现分页。

HTML ：

添加一个 DataGrid ，命名为 dgOrder 。
添加了一个模板列，模板列里放一个名为 Cb 的 CheckBox 控件。此列用来实现选择
为要排序的每个列加上排序表达式 SortExpression 。
利用列的 DataFormatString 来格式化列，象 DataFormatString="{0:d}" 显示日期格式。
设置 PageSize="15" 每页显示 15 行数据， AllowPaging="True" 为允许分页。

** 整个 HTML ** ** 页代码： **

 1<form id="Form1" method="post" runat="server">
 2<asp:datagrid allowpaging="True" allowsorting="True" autogeneratecolumns="False" backcolor="White" bordercolor="#A0ABEB" borderstyle="Solid" borderwidth="1px" cellpadding="4" forecolor="Black" gridlines="Vertical" height="515px" id="dgOrder" pagesize="15" runat="server" showfooter="True" width="718px">
 3<selecteditemstyle backcolor="Black" forecolor="White"></selecteditemstyle>
 4<alternatingitemstyle backcolor="#EEEEEE"></alternatingitemstyle>
 5<headerstyle backcolor="#  6876C  5" bordercolor="#  6876C  5" forecolor="White" horizontalalign="Center"></headerstyle>
 6<footerstyle backcolor="#  6876C  5" forecolor="White"></footerstyle>
 7<columns>
 8<asp:templatecolumn>
 9<itemtemplate>
10<font face="  宋体  ">
11<asp:checkbox id="Cb" runat="server"></asp:checkbox></font>
12</itemtemplate>
13</asp:templatecolumn>
14<asp:boundcolumn datafield="orderid" headertext="ID" sortexpression="orderid">
15<headerstyle width="180px"></headerstyle>
16</asp:boundcolumn>
17<asp:boundcolumn datafield="ShipCountry" headertext="ShipCountry" sortexpression="ShipCountry">
18<headerstyle width="180px"></headerstyle>
19</asp:boundcolumn>
20<asp:boundcolumn datafield="ShippedDate" dataformatstring="{0:d}" headertext="ShippedDate" sortexpression="ShippedDate">
21<headerstyle width="180px"></headerstyle>
22</asp:boundcolumn>
23<asp:boundcolumn datafield="Freight" headertext="Freight" sortexpression="Freight">
24<headerstyle width="180px"></headerstyle>
25</asp:boundcolumn>
26<asp:boundcolumn datafield="ShipAddress" headertext="ShipAddress" sortexpression="ShipAddress">
27<headerstyle width="480px"></headerstyle>
28</asp:boundcolumn>
29</columns>
30<pagerstyle backcolor="White" forecolor="Black" horizontalalign="Center" mode="NumericPages" position="TopAndBottom"></pagerstyle>
31</asp:datagrid>
32</form>

** 后台类添加以下代码： **

Imports System.Data.SqlClient

' 得到数据视图，参数为要排序的列

Private Function GetDv( ByVal strSort As String ) As DataView

' 定义数据库连接

Dim dv As DataView

Dim CN As New SqlConnection()

Try

' 初始化连接字符串

CN.ConnectionString = "data source=pmserver;initial catalog=Northwind;persist security info=False;user id=sa;Password=sa;"

CN.Open()

' 从 NorthWind 得到 orders 表的数据

Dim adp As SqlDataAdapter = New SqlDataAdapter( "select * from orders" , CN)

Dim ds As New DataSet()

adp.Fill(ds)

' 得到数据视图

dv = ds.Tables( 0 ).DefaultView

Catch ex As Exception

If DEBUG Then

Session( "Error" ) = ex.ToString()

Response.Redirect( "../error.aspx" ) ' 跳转程序的公共错误处理页面

End If

Finally

' 关闭连接

CN.Close()

End Try

' 排序

dv.Sort = strSort

Return dv

End Function

Private Sub Page_Load( ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase .Load

If Not IsPostBack Then

ViewState( "strSort" ) = "orderid"

dgOrder.DataSource = GetDv(ViewState( "strSort" ).ToString())

dgOrder.DataBind()

End If

End Sub

' 排序

Private Sub dgOrder_SortCommand( ByVal source As Object , ByVal e As System.Web.UI.WebControls.DataGridSortCommandEventArgs) Handles dgOrder.SortCommand

dgOrder.CurrentPageIndex = 0

' 得到排序的列

ViewState( "strSort" ) = e.SortExpression.ToString()

dgOrder.DataSource = GetDv(ViewState( "strSort" ).ToString())

dgOrder.DataBind()

End Sub

' 分页

Private Sub dgOrder_PageIndexChanged( ByVal source As Object , ByVal e As System.Web.UI.WebControls.DataGridPageChangedEventArgs) Handles dgOrder.PageIndexChanged

' 得到分页的页号

dgOrder.CurrentPageIndex = e.NewPageIndex

dgOrder.DataSource = GetDv(ViewState( "strSort" ).ToString())

dgOrder.DataBind()

End Sub

运行结果如下图所示：( 点击列标头可以排序)

为了知道用户选择的是哪些记录，我们可以利用 DataGridItem 的 FindControl 得到 CheckBox 的值，我们来添加一个按钮，再写如下代码：

Private Sub Button1_Click( ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click

Dim item As DataGridItem

Dim StrScript As String

StrScript = "

 1<script language="javascript">alert('" 
 2
 3'  循环表格的项，  FindControl 
 4
 5For  Each  item  In  Me  .dgOrder.Items 
 6
 7If  CType  (item.FindControl(  "cb"  ), System.Web.UI.WebControls.CheckBox).Checked  Then 
 8
 9Try 
10
11StrScript += item.Cells(  1  ).Text & Space(  2  ) 
12
13Catch  ex  As  Exception 
14
15End  Try 
16
17End  If 
18
19Next 
20
21StrScript +=  "  被选择！  ')</script>

RegisterClientScriptBlock( " 系统消息 " , StrScript)

End Sub

上面的代码 RegisterClientScriptBlock 添加 Java Script 脚本弹出对话框。（其实 Vb S cript 的对话框比 J ava Script 的对话框多更多的显示和控制方式，但 Netscape 的浏览器不支持，大家可根据相应的项目在程序里选择用哪种脚本）。

** 总结： **

DataGrid 是我们常用的 Web 控件，有时我们还可以和 DataList 混合使用，通过修改 HTML 页，可以达到好的页面效果。上面只是一个例子，为了便于清楚整个过程，我把数据访问部分 (SQL) 写到了页面中。在软件开发中，我们一般把访问数据的部分写成数据层，页面调用数据层得到数据，这样逻辑清晰，修改和维护都很方便。

‘***************************************************************

‘Author: 李洪根

‘MAIL: [email protected]

‘ 专栏： http://www.csdn.net/develop/author/netauthor/lihonggen0/

‘ 如需引用，请指明出处！ CSDN 论坛 VB 版欢迎您！

‘***************************************************************

让Asp.NET的DataGrid可排序、可选择、可分页

让 Asp.NET 的 DataGrid 可排序、可选择、可分页

设计思路：

If DEBUG Then

End If