65.9K
CodeProject 正在变化。 阅读更多。
Home

ASP.NET 2.0 中的 Gridview

starIconstarIcon
emptyStarIcon
starIcon
emptyStarIconemptyStarIcon

2.33/5 (8投票s)

2007年8月30日

1分钟阅读

viewsIcon

56524

它解释了 gridview 的分页和排序。

引言

在 ASP.NET 2.0 中,数据网格控件被转换为 Gridview,并增加了新功能。
本文介绍了如何在 Gridview 中进行排序、分页以及添加按钮控件。

分页和排序功能

在 Gridview 中,可以同时实现分页和排序。

使用代码

HTML 页面看起来像这样。

<asp:GridView ID="gvView" runat="server"  
PagerSettings-Position="TopAndBottom" AutoGenerateColumns="False" 
AllowPaging="True" AllowSorting="True"
OnPageIndexChanging="gvView_PageIndexChanging" 
OnSorting="gvView_Sorting"  OnRowDataBound="gvView_RowDataBound"
HeaderStyle-CssClass="GridTableHeader"
 AlternatingRowStyle-CssClass="GridTableCellsAlt"
RowStyle-CssClass="GridTableCells" >
<PagerStyle HorizontalAlign="left" />
<Columns>
                             
<asp:TemplateField HeaderStyle-CssClass="GridTableHeader" >
<ItemTemplate >
<asp:Button ID="btnViewDetails" Text="ViewDetails" runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
 <HeaderStyle Font-Size="Small"  />
</asp:TemplateField> 
<asp:BoundField DataField="EmpId" HeaderText="EmpID" SortExpression="EmpId" />
 <asp:BoundField DataField="EmpName" HeaderText="EmpName" 
SortExpression="EmpName" />
     
 </Columns>
 </asp:GridView>

   /// Binds the resultset to the datagrid
   private void BindDatagrid()
   {
       DataSet dsData;
       try
       {
         // Populate dataset dsData from the source.
         // It may be from database or from the session.
                if (dsData!= null)
                {
                    if (dsData.Tables[0].Rows.Count >

当点击分页按钮时,会调用 PageIndexChanging 事件。

/// Called when the page index is changed
    protected void gvView_PageIndexChanging(object sender,
                        GridViewPageEventArgs e)
    {
        DataSet dsData = (DataSet)Session["dsData"];
        DataTable dtData = dsData.Tables[0];
        gvView.DataSource = SortDataTable(dtData, true);
        gvView.PageIndex = e.NewPageIndex;
        gvView.DataBind();
    }
  /// Called when the grid coloumn is clicked for sorting
    protected void gvView_Sorting(object sender, GridViewSortEventArgs e)
    {
        DataSet dsData = (DataSet)Session["dsData"];
        DataTable dtData = dsData.Tables[0];
        GridViewSortExpression = e.SortExpression;
        //get the pageindex of the grid.
        int pageIndex = gvView.PageIndex;
        gvView.DataSource = SortDataTable(dtData, false);
        gvView.DataBind();
        gvView.PageIndex = pageIndex;

}

GridViewSortDirection 和 GridViewSortExpression 函数初始化
默认排序方向为升序,表达式为空字符串。
后续的排序方向将从 GetSortDirection 函数中确定。

/// Gets or Sets the gridview sortdirection property
    private string GridViewSortDirection
    {
        get
        {
            return ViewState["SortDirection"] as string ?? "ASC";
        }
        set
        {
            ViewState["SortDirection"] = value;
        }
    }
    /// Gets or Sets the gridview sortexpression property
    private string GridViewSortExpression
    {
        get
        {
            return ViewState["SortExpression"] as string ?? string.Empty;
        }
        set
        {
            ViewState["SortExpression"] = value;
        }
    }
    /// Returns the direction of the sorting
    private string GetSortDirection()
    {
        switch (GridViewSortDirection)
        {
            case "ASC":
                GridViewSortDirection = "DESC";
                break;
            case "DESC":
                GridViewSortDirection = "ASC";
                break;
        }
        return GridViewSortDirection;
    }

SortDataTable 将根据所选页面
和所选排序方向对数据表进行排序。

/// Sorts the resultset based on the sortexpression and the selected column.
protected DataView SortDataTable(DataTable dataTable, bool isPageIndexChanging)
    {
        if (dataTable != null)
        {
            DataView dataView = new DataView(dataTable);
            if (GridViewSortExpression != string.Empty)
            {
                if (isPageIndexChanging)
                {
                    dataView.Sort = string.Format("{0} {1}", 
                    GridViewSortExpression, GridViewSortDirection);
                }
                else
                {
                    dataView.Sort = string.Format("{0} {1}", 
                   GridViewSortExpression, GetSortDirection());
                }
            }
            return dataView;
        }
        else
        {
            return new DataView();
        }
    }

Gridview 内部的按钮控件

可以在 Gridview 内部添加按钮控件。按钮控件
可以根据需要动态地显示/隐藏。

例如:

从工具栏中拖放一个 Gridview 到你的 HTML 页面中。
在 Gridview 控件中添加一个按钮。参考下面的代码片段。

<script language ="javascript" type="text/javascript">
//This function is executed when the VIEWDETAILS button in a 
particular row is clicked, which takes the row's  details as
 parameters and opens the DetailData.aspx with parameters 
passed in querystring
        function OpenDetailsPage (EmpId)
        {
           var WinSettings = "center:yes;resizable:no;dialogHeight:600px;
                           scroll:no;status:no"         
           window.showModalDialog("DetailData.aspx?ApplicationID="+EmpId,
                                   null,WinSettings);
           return false;
        }
</script>


<asp:GridView ID="gvView" runat="server"  
PagerSettings-Position="TopAndBottom" AutoGenerateColumns="False" 
AllowPaging="True" AllowSorting="True"
OnPageIndexChanging="gvView_PageIndexChanging" OnSorting="gvView_Sorting" 
 OnRowDataBound="gvView_RowDataBound"
HeaderStyle-CssClass="GridTableHeader" 
AlternatingRowStyle-CssClass="GridTableCellsAlt"
RowStyle-CssClass="GridTableCells" >
<PagerStyle HorizontalAlign="left" />
<Columns>
                             
<asp:TemplateField HeaderStyle-CssClass="GridTableHeader" >
<ItemTemplate >
<asp:Button ID="btnViewDetails" Text="ViewDetails" runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
 <HeaderStyle Font-Size="Small"  />
</asp:TemplateField> 
<asp:BoundField DataField="EmpId" 
HeaderText="EmpID" SortExpression="EmpId" />
 <asp:BoundField DataField="EmpName" HeaderText="EmpName" 
  SortExpression="EmpName" />
     
 </Columns>
 </asp:GridView>

你可以从你的 .cs 页面控制按钮的 visible 或 invisible 属性。

例如:考虑以下场景。需要用从数据集填充的员工详细信息填充数据网格。
使用从数据集填充的员工详细信息。
条件是如果用户属于 Admin 组,ViewDetails
按钮应该可见,这样通过点击按钮,用户将
能够在新的窗口中查看详细信息。

数据集包含一个名为“Admin”的列,该列保存
0 或 1。对于 Admin 值为 1 的行,按钮应该可见。

对于上述要求,代码应该这样编写

/// Binds the datagrid rows items
 protected void gvView_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {


            Button btnViewDetails = (Button)e.Row.FindControl
                                    ("btnViewDetails");
            if( Convert.ToInt32(DataBinder.Eval(e.Row.DataItem,
                 "Admin")) == 1)
            {
                //Add an attribute to the button ViewDetails
                btnViewDetails.Attributes.Add("onclick", 
           "return OpenDetailsPage('" + DataBinder.Eval(e.Row.DataItem, 
           "EmpID") + "')");
            }
            else
            {
                btnViewDetails.Visible = false;
            }
        }
    }

点击按钮后,该方法将调用一个 JavaScript 函数来打开一个新窗口。

© . All rights reserved.