ASP.Net2.0 GridView 多列排序,显示排序图标,分页(转)

最近在使用ASP.net 2.0的GridView 控件时,发现排序与分页功能Microsoft实现的都很简单,比如排序,在点击列名的时候来触发整页的PostBack,然后排序,但是在列头上没有一个显示升序降序的图标,这会让最终用户使用时很迷惑,因为不知道是升序了还是降序了,所以今天首先解决的第一问题就是升序降序在列上显示图标,第二要解决的问题是默认GridView按列排序只能排一列的,也就是不能进行多列排序,而在实际应用中仅仅按照一列来排序是不能满足业务需求的,第三是GridView 分页问题,GridView预定义的分页页码显示,比较简单,而实际应用中,分页可能不是只显示首页,上一页,下一页,末页,或者是数字的页码那么简单,应该更需要,跳转,当前的页码,总页数等,更详尽的信息。

第一:GridView 多列排序与排序图标显示

首先我们可以新建一个类库程序,主要需要引用System.Web.Dll文件
然后新建一个类,这个类继承与GridView控件,我们只需要对部分方法进行重新即可。
我的演示的例子,采用了单列排序,如果启用多列排序,把控件的AllowMultiColumnSorting设置为True就是
多列排序。
 public class WebGridView:GridView
    
{
        属性
#region 属性
        
/**//// <summary>
        
/// 是否启用或者禁止多列排序
       
/// </summary>

        [
        Description(
"是否启用多列排序功能"),
        Category(
"排序"),
        DefaultValue(
"false"),
        ]
        
public bool AllowMultiColumnSorting
        
{
            
get
            
{
                
object o = ViewState["EnableMultiColumnSorting"];
                
return (o != null ? (bool)o : false);
            }

            
set
            
{
                AllowSorting 
= true;
                ViewState[
"EnableMultiColumnSorting"= value;
            }

        }

        
/**//// <summary>
        
/// 升序时显示图标
        
/// </summary>

        [
        Description(
"升序时显示图标"),
        Category(
"排序"),
        Editor(
"System.Web.UI.Design.UrlEditor"typeof(System.Drawing.Design.UITypeEditor)),
        DefaultValue(
""),

        ]
        
public string SortAscImageUrl
        
{
            
get
            
{
                
object o = ViewState["SortImageAsc"];
                
return (o != null ? o.ToString() : "");
            }

            
set
            
{
                ViewState[
"SortImageAsc"= value;
            }

        }

        
/**//// <summary>
        
/// 降序时显示图标
        
/// </summary>

        [
        Description(
"降序时显示图标"),
        Category(
"排序"),
        Editor(
"System.Web.UI.Design.UrlEditor"typeof(System.Drawing.Design.UITypeEditor)),
        DefaultValue(
""),
        ]
        
public string SortDescImageUrl
        
{
            
get
            
{
                
object o = ViewState["SortImageDesc"];
                
return (o != null ? o.ToString() : "");
            }

            
set
            
{
                ViewState[
"SortImageDesc"= value;
            }

        }

        
#endregion

        重写方法
重写方法
        受保护的方法
#region 受保护的方法
        
/**//// <summary>
        
///  获取排序表达式
        
/// </summary>

        protected string GetSortExpression(GridViewSortEventArgs e)
        
{
            
string[] sortColumns = null;
            
string sortAttribute = SortExpression;

            
if (sortAttribute != String.Empty)
            
{
                sortColumns 
= sortAttribute.Split(",".ToCharArray());
            }

            
if (sortAttribute.IndexOf(e.SortExpression) > 0 || sortAttribute.StartsWith(e.SortExpression))
            
{
                sortAttribute 
= ModifySortExpression(sortColumns, e.SortExpression);
            }

            
else
            
{
                sortAttribute 
+= String.Concat(",", e.SortExpression, " ASC ");
            }

            
return sortAttribute.TrimStart(",".ToCharArray()).TrimEnd(",".ToCharArray());

        }

        
/**//// <summary>
        
///  修改排序顺序
        
/// </summary>

        protected string ModifySortExpression(string[] sortColumns, string sortExpression)
        
{
            
string ascSortExpression = String.Concat(sortExpression, " ASC ");
            
string descSortExpression = String.Concat(sortExpression, " DESC ");

            
for (int i = 0; i < sortColumns.Length; i++)
            
{

                
if (ascSortExpression.Equals(sortColumns[i]))
                
{
                    sortColumns[i] 
= descSortExpression;
                }


                
else if (descSortExpression.Equals(sortColumns[i]))
                
{
                    Array.Clear(sortColumns, i, 
1);
                }

            }


            
return String.Join(",", sortColumns).Replace(",,"",").TrimStart(",".ToCharArray());

        }

        
/**//// <summary>
        
///  获取当前的表达式对所选列进行排序
        
/// </summary>

        protected void SearchSortExpression(string[] sortColumns, string sortColumn, out string sortOrder, out int sortOrderNo)
        
{
            sortOrder 
= "";
            sortOrderNo 
= -1;
            
for (int i = 0; i < sortColumns.Length; i++)
            
{
                
if (sortColumns[i].StartsWith(sortColumn))
                
{
                    sortOrderNo 
= i + 1;
                    
if (AllowMultiColumnSorting)
                    
{
                        sortOrder 
= sortColumns[i].Substring(sortColumn.Length).Trim();
                    }

                    
else
                    
{
                        sortOrder 
= ((SortDirection == SortDirection.Ascending) ? "ASC" : "DESC");
                    }

                }

            }

        }

        
/**//// <summary>
        
///  绘制升序降序的图片
        
/// </summary>

        protected void DisplaySortOrderImages(string sortExpression, GridViewRow dgItem)
        
{
            
string[] sortColumns = sortExpression.Split(",".ToCharArray());

            
for (int i = 0; i < dgItem.Cells.Count; i++)
            
{
                
if (dgItem.Cells[i].Controls.Count > 0 && dgItem.Cells[i].Controls[0is LinkButton)
                
{
                    
string sortOrder;
                    
int sortOrderNo;
                    
string column = ((LinkButton)dgItem.Cells[i].Controls[0]).CommandArgument;
                    SearchSortExpression(sortColumns, column, 
out sortOrder, out sortOrderNo);
                    
if (sortOrderNo > 0)
                    
{
                        
string sortImgLoc = (sortOrder.Equals("ASC"? SortAscImageUrl : SortDescImageUrl);

                        
if (sortImgLoc != String.Empty)
                        
{
                            Image imgSortDirection 
= new Image();
                            imgSortDirection.ImageUrl 
= sortImgLoc;
                            dgItem.Cells[i].Controls.Add(imgSortDirection);

                        }

                        
else
                        
{

                            
if (AllowMultiColumnSorting)
                            
{
                                Literal litSortSeq 
= new Literal();
                                litSortSeq.Text 
= sortOrderNo.ToString();
                                dgItem.Cells[i].Controls.Add(litSortSeq);

                            }

                       }

                    }

                }

            }


        }

        
#endregion

    }
第二:详尽的分页信息显示,此功能没有封装成控件形式,直接在GridView_DataBound事件中对尾页操作即可。
下面是多列排序与分页显示代码的演示
<script runat="server">
    
void PageDropDownList_SelectedIndexChanged(Object sender, EventArgs e)
    
{
        GridViewRow pagerRow 
= CustomersGridView.BottomPagerRow;
        DropDownList pageList 
= (DropDownList)pagerRow.Cells[0].FindControl("PageDropDownList");
        CustomersGridView.PageIndex 
= pageList.SelectedIndex;
    }

    
void CustomersGridView_DataBound(Object sender, EventArgs e)
    
{
        GridViewRow pagerRow 
= CustomersGridView.BottomPagerRow;

        LinkButton linkBtnFirst 
= (LinkButton)pagerRow.Cells[0].FindControl("linkBtnFirst");
        LinkButton linkBtnPrev 
= (LinkButton)pagerRow.Cells[0].FindControl("linkBtnPrev");
        LinkButton linkBtnNext 
= (LinkButton)pagerRow.Cells[0].FindControl("linkBtnNext");
        LinkButton linkBtnLast 
= (LinkButton)pagerRow.Cells[0].FindControl("linkBtnLast");

        
if (CustomersGridView.PageIndex == 0)
        
{
            linkBtnFirst.Enabled 
= false;
            linkBtnPrev.Enabled 
= false;
        }

        
else if (CustomersGridView.PageIndex == CustomersGridView.PageCount-1)
        
{
            linkBtnLast.Enabled  
= false;
            linkBtnNext.Enabled 
= false;
        }

        
else if (CustomersGridView.PageCount<=0)
        
{
            linkBtnFirst.Enabled 
= false;
            linkBtnPrev.Enabled 
= false;
            linkBtnNext.Enabled 
= false;
            linkBtnLast.Enabled 
= false;
        }

        DropDownList pageList 
= (DropDownList)pagerRow.Cells[0].FindControl("PageDropDownList");
        Label pageLabel 
= (Label)pagerRow.Cells[0].FindControl("CurrentPageLabel");

        
if (pageList != null)
        
{
            
for (int i = 0; i < CustomersGridView.PageCount; i++)
            
{
                
int pageNumber = i + 1;
                ListItem item 
= new ListItem(pageNumber.ToString() + "/" + CustomersGridView.PageCount.ToString(), pageNumber.ToString());
                
if (i == CustomersGridView.PageIndex)
                
{
                    item.Selected 
= true;
                }

                pageList.Items.Add(item);

            }


        }

        
if (pageLabel != null)
        
{
            
int currentPage = CustomersGridView.PageIndex + 1;
            pageLabel.Text 
= "当前页: " + currentPage.ToString() +
              
" / " + CustomersGridView.PageCount.ToString();
        }

    }


</script>

<html>
<body>
    
<form id="Form1" runat="server">
        
<h3>
            GridView PagerTemplate Example
</h3>
        
<asp:WebGridView ID="CustomersGridView" DataSourceID="CustomersSqlDataSource" AutoGenerateColumns="true"
            AllowPaging
="true" OnDataBound="CustomersGridView_DataBound" SortAscImageUrl="~imagesarrow-up.gif" SortDescImageUrl="~imagesarrow-down.gif" runat="server" AllowSorting="True" Width="723px">
            
<PagerStyle ForeColor="Blue" BackColor="LightBlue" />
            
<PagerTemplate>
                
<table width="100%">
                    
<tr>
                        
<td width="70%">
                            
<asp:Label ID="MessageLabel" ForeColor="Blue" Text="页码:" runat="server" />
                            
<asp:DropDownList ID="PageDropDownList" AutoPostBack="true" OnSelectedIndexChanged="PageDropDownList_SelectedIndexChanged"
                                runat
="server" />
                            
<asp:LinkButton CommandName="Page" CommandArgument="First" ID="linkBtnFirst" runat="server">首页</asp:LinkButton>
                            
<asp:LinkButton CommandName="Page" CommandArgument="Prev" ID="linkBtnPrev" runat="server">上一页</asp:LinkButton>
                            
<asp:LinkButton CommandName="Page" CommandArgument="Next" ID="linkBtnNext" runat="server">下一页</asp:LinkButton>
                            
<asp:LinkButton CommandName="Page" CommandArgument="Last" ID="linkBtnLast" runat="server">末页</asp:LinkButton>
                        
</td>
                        
<td width="70%" align="right">
                            
<asp:Label ID="CurrentPageLabel" ForeColor="Blue" runat="server" />
                        
</td>
                    
</tr>
                
</table>
            
</PagerTemplate>
       
</asp:WebGridView>
        
<asp:SqlDataSource ID="CustomersSqlDataSource" SelectCommand="Select [CustomerID], [CompanyName], [Address], [City], [PostalCode], [Country] From [Customers]"
            ConnectionString
="<%$ ConnectionStrings:NorthWindConnectionString%>" runat="server">
        
</asp:SqlDataSource>

    
</form>
</body>
</html>

效果:

 

posted @ 2008-08-29 11:00  遥望星空  阅读(497)  评论(0编辑  收藏  举报