[转]Gridview实现多列排序,并显示图标

本文转自：http://blog.csdn.net/gmjinrong/article/details/4516301

GridView实现支持多列排序,并显示升、降序图标上网找了很多资料参考才解决了问题

现分享如下:

1.新建StyleSheet.css,图片自己准备及路径需自行更改.

.alternatingrowstyle{
/* background-color:#f9f9f9;*/
background-color:White;
}

.sortascheaderstyle{
    background:#F2F2F2 url(../Img/sort_asc.gif) no-repeat scroll right center;
    padding-left:5px;
}
.sortdescheaderstyle{
    background:#F2F2F2 url(../Img/sort_desc.gif) no-repeat scroll right center;
    padding-left:5px;
}

.ItemStyle
{

}

.gridview
{
word-break:break-all;
word-wrap:break-word
}

headerstyle{
   /* background-color:#e5e5e5;*/
   background-color:#F2F2F2;
    height:23px;
}

.headerstyle th {
    border:1px solid #bbbbbb;
    padding-left:5px;
    text-align:left;
}
.headerstyle a {
    color:black;
}

.pagerstyle{
    color:#444444;
    background-color:#e5e5e5;
    font-size:x-small;
    text-align:right;
}

2.前台

引用:

</head>

Gridview部分:

<asp:GridView ID="givOrder" runat="server" CssClass="gridview"
             AutoGenerateColumns="False" OnRowDataBound="givOrder_RowDataBound"
             DataKeyNames="Rowid" AllowSorting="True"
             onsorting="givOrder_Sorting" >
           <AlternatingRowStyle CssClass="alternatingrowstyle" />
          <HeaderStyle CssClass="headerstyle" />
          <PagerStyle CssClass="pagerstyle" />

           <Columns>
                <asp:TemplateField ItemStyle-HorizontalAlign="Center" ItemStyle-Width="30px">
                    <ItemTemplate>
                        <%# Convert.ToInt32(DataBinder.Eval(Container, "DataItemIndex")) + 1 %>
                    </ItemTemplate>
                    <ItemStyle CssClass="ItemStyle"/>
                </asp:TemplateField>

                 <asp:TemplateField ItemStyle-HorizontalAlign="Center"
                    HeaderText="订单号" SortExpression="OrderNo">
                    <ItemTemplate>
                       <asp:TextBox ID="txtOrderNo" runat="server" TextMode="MultiLine"   CssClass="textBox" Rows="1" Width="60px" Text='<%# Bind("orderNo") %>' ></asp:TextBox>
                    </ItemTemplate>
                </asp:TemplateField>

                <asp:TemplateField ItemStyle-HorizontalAlign="Center"
                    HeaderText="客户" SortExpression="CustomerName" >
                    <ItemTemplate>
                        <asp:TextBox ID="txtCustomerName" runat="server" TextMode="MultiLine" CssClass="textBox" Rows="1" Width="100px" Text='<%# Bind("CustomerName") %>' ></asp:TextBox>
                    </ItemTemplate>
                </asp:TemplateField>

</Columns>
</asp:GridView>

后台实现:

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                GridViewDataBind(); //自己实现的数据绑定DataSource
                IDictionary<string, string> idic = new Dictionary<string, string>();
                ViewState["sortIDic"] = idic;

            }


        }

protected void givOrder_Sorting(object sender, GridViewSortEventArgs e)
{

int cellIndex = -1;

            foreach (DataControlField field in givOrder.Columns)
            {
                if (field.SortExpression == e.SortExpression)
                {
                    cellIndex =givOrder.Columns.IndexOf(field);
                    if (ViewState["cellindex"] != null)
                    {
                        int oldCellindex=int.Parse(ViewState["cellindex"].ToString());
                        if (oldCellindex != cellIndex)
                            givOrder.Columns[oldCellindex].HeaderStyle.CssClass = "";
                    }

                    break;
                }
            }

string sortExpression = e.SortExpression;

IDictionary<string, string> idic = ViewState["sortIDic"] as IDictionary<string, string>;

            if (!idic.ContainsKey(sortExpression))
            {
                idic.Add(e.SortExpression, e.SortDirection.ToString().Replace("Ascending", "ASC").Replace("Descending", "DESC"));
                givOrder.Columns[cellIndex].HeaderStyle.CssClass = "sortascheaderstyle";

            }
            else
            {
                string strSortDirection = idic[e.SortExpression];

                if (strSortDirection == "ASC")
                {
                    idic[e.SortExpression] = "DESC";
                    givOrder.Columns[cellIndex].HeaderStyle.CssClass = "sortdescheaderstyle";

                }
                else if (strSortDirection == "DESC")
                {
                    idic.Remove(e.SortExpression);
                    givOrder.Columns[cellIndex].HeaderStyle.CssClass = "";

                }
            }

ViewState["sortIDic"] = idic;
ViewState["cellindex"] = cellIndex;

SortGridView();

}

        /// <summary>
        /// 实现多行排序
        /// </summary>
          private void SortGridView()
        {
            StringBuilder sbSortExpression = new StringBuilder();

             IDictionary<string, string> idic = ViewState["sortIDic"] as IDictionary<string, string>;
             string[] strkeys = new string[idic.Count];

             if (idic.Count > 0)
             {
                 idic.Keys.CopyTo(strkeys, 0);
                 for (int i = 0; i <idic.Count; i++)
                 {
                     sbSortExpression.Append(strkeys[i]);
                     sbSortExpression.Append(" ");
                     sbSortExpression.Append(idic[strkeys[i]]);

if (i != idic.Count-1)
sbSortExpression.Append(", ");

                 }

             }

             clsborder l_order = new clsborder();
             DataTable dt = l_order.SelectOrder();

             DataView dv = dt.DefaultView;

             dv.Sort = sbSortExpression.ToString();

             givOrder.DataSource = dv;
             givOrder.DataBind();

        }

posted on 2017-12-25 10:04 freeliver54 阅读(229) 评论(0) 编辑收藏举报

刷新页面返回顶部

Love in coding...

[转]Gridview实现多列排序,并显示图标

导航

公告