Question

我有一个GridView，它从代码隐藏中加载了它的列。我在aspx页面中指定的标头CSS类，但它没有为这些列加载。所以我在绑定后的代码隐藏中添加了：GridView1.HeaderRow.CssClass =“HeaderStyle”然后加载。我不知道如何为排序列样式做这个。

这是代码隐藏。知道我需要输入什么样式来排序已排序的列以及它应该添加到何处？我可以在任何地方为排序列指定“SortedAscendingHeaderStyle”和“SortedDescendingHeaderStyle”吗？

Sub Page_load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Page.IsPostBack Then
        CreateGridColumns()
        BindGrid()
    End If
End Sub

Public Property SortExpression As String
    Get
        If ViewState("SortExpression") Is Nothing Then
            ViewState("SortExpression") = "LastName ASC"
        End If
        Return ViewState("SortExpression").ToString
    End Get
    Set(ByVal value As String)
        ViewState("SortExpression") = value
    End Set
End Property

Private Sub CreateGridColumns()
    Dim curLastName As New BoundField
    curLastName.HeaderText = "Last Name"
    curLastName.DataField = "LastName"
    curLastName.SortExpression = "LastName"

    GridView1.Columns.Insert(0, curLastName)


    Dim curFirstName As New BoundField
    curFirstName.HeaderText = "First Name"
    curFirstName.DataField = "FirstName"
    curFirstName.SortExpression = "FirstName"

    GridView1.Columns.Insert(1, curFirstName)

End Sub

Private Sub BindGrid()
    Try
        Dim tblData = New DataTable
        Using sqlCon As New SqlClient.SqlConnection(ConfigurationManager.ConnectionStrings("dbConnectionString").ConnectionString.ToString())
            Dim sql As String = "SELECT * FROM EmployeeList ORDER BY {0}"
            Dim sqlCmd = New SqlClient.SqlCommand()
            sqlCmd.CommandText = String.Format(sql, Me.SortExpression)
            sqlCmd.Connection = sqlCon
            Using objAdapter As New SqlClient.SqlDataAdapter(sqlCmd)
                objAdapter.Fill(tblData)
            End Using
        End Using
        GridView1.DataSource = tblData
        GridView1.DataBind()

        GridView1.HeaderRow.CssClass = "HeaderStyle"

    Catch ex As Exception
        ' TODO: log error '
        Throw
    End Try
End Sub
Private Sub GridView1_PageIndexChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewPageEventArgs) Handles GridView1.PageIndexChanging
    Me.GridView1.PageIndex = e.NewPageIndex
    BindGrid()
End Sub

Private Sub GridView1_Sorting(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewSortEventArgs) Handles GridView1.Sorting
    Dim currentSortColumn, currentSortDirection As String
    currentSortColumn = Me.SortExpression.Split(" "c)(0)
    currentSortDirection = Me.SortExpression.Split(" "c)(1)
    If e.SortExpression.Equals(currentSortColumn) Then
        ' switch sort direction '
        Select Case currentSortDirection.ToUpper
            Case "ASC"
                Me.SortExpression = currentSortColumn & " DESC"
            Case "DESC"
                Me.SortExpression = currentSortColumn & " ASC"
        End Select
    Else
        Me.SortExpression = e.SortExpression & " ASC"
    End If
    BindGrid()

End Sub

这是GridView标记：

<asp:GridView  ID="GridView1"  runat="server"  AllowSorting="True"  AutoGenerateColumns="False" 
 EmptyDataText="There are no data records to display." AllowPaging="True" 
 CssClass="GridViewStyle" GridLines="None" Width="100%">

 <Columns>

    <asp:BoundField DataField="Dept" HeaderText="Dept" SortExpression="Dept" />
    <asp:HyperLinkField DataNavigateUrlFields="EmplID"
        DataNavigateUrlFormatString="EmployeeProfile.aspx?EmplID={0}"
        DataTextField="EmplID"
        DataTextFormatString= "<img src='Images/icons/document-search-result.png' alt='View'/> <u>View</u>" >
        <ControlStyle CssClass="titleLinksB" />
    <ItemStyle Wrap="False" />
    </asp:HyperLinkField>

    </Columns>
    <RowStyle CssClass="RowStyle" />
        <EmptyDataRowStyle CssClass="EmptyRowStyle" />
        <PagerSettings Mode="NumericFirstLast" PageButtonCount="5" />
        <PagerStyle CssClass="PagerStyle" />
        <SelectedRowStyle CssClass="SelectedRowStyle" />
        <HeaderStyle CssClass="HeaderStyle" />
        <EditRowStyle CssClass="EditRowStyle" />
        <AlternatingRowStyle CssClass="AltRowStyle" />
        <SortedAscendingHeaderStyle CssClass="sortasc"></SortedAscendingHeaderStyle>
        <SortedDescendingHeaderStyle CssClass="sortdesc"></SortedDescendingHeaderStyle>

</asp:GridView>

感谢您的帮助！

Answer 1

如果对链接到数据源的GridView使用内置排序，则可以在标记中定义它们：

<asp:GridView ID="GridView1" runat="server" AllowSorting="True" CellPadding="4">
  <SortedAscendingCellStyle CssClass="SortedAscendingCellStyle" />
  <SortedAscendingHeaderStyle CssClass="SortedAscendingHeaderStyle" />
  <SortedDescendingCellStyle CssClass="SortedDescendingCellStyle" />
  <SortedDescendingHeaderStyle CssClass="SortedDescendingHeaderStyle " />
</asp:GridView>

由于您正在实现自己的排序和数据绑定，因此您还需要在RowDataBound事件中自己设置排序列样式。

    protected void gdv_RowDataBound(object sender, GridViewRowEventArgs e) {
        GridView gridView = (GridView)sender;
        string sortColumn, sortDirection;
        sortColumn = this.SortExpression.Split(' ')[0];
        sortDirection = this.SortExpression.Split(' ')[1];

        if (e.Row.RowType == DataControlRowType.Header) {
            int cellIndex = -1;
            foreach (DataControlField field in gridView.Columns) {
                if (field.SortExpression == sortColumn) {
                    cellIndex = gridView.Columns.IndexOf(field);
                }
            }

            if (cellIndex > -1) {
                //  this is a header row, set the sort style
                e.Row.Cells[cellIndex].CssClass = sortDirection == "ASC" ? "sortasc" : "sortdesc";
            }
        }
    }

Answer 2

试试这个

    protected void grid_RowSorting(object sender, GridViewSortEventArgs e)
    {
        string sortExpression = e.SortExpression;
        string sortDirection = GetSortDirection(sortExpression);
        //.. Fill Grid & Sort Grid
        SetHeaderSortCss((GridView)sender, sortExpression, sortDirection, "defaultCss"); 
    }

    private void SetHeaderSortCss(GridView grid, string columnName, string direction, string defaultCss)
    {           
        for (int i = 0; i < grid.Columns.Count; i++)
        {
            if (grid.Columns[i].SortExpression.ToLower().Trim() == columnName.ToLower().Trim())
            {
                grid.Columns[i].HeaderStyle.CssClass = "sort"+direction; //Set sorted Css
            }
            else
            {
                grid.Columns[i].HeaderStyle.CssClass = defaultCss; //Clear Others Css
            }
        }
    }

    private string GetSortDirection(string SortExpression)
    {
        if (ViewState[SortExpression] == null)
            ViewState[SortExpression] = "Desc";
        else
            ViewState[SortExpression] = ViewState[SortExpression].ToString() == "Desc" ? "Asc" : "Desc";

        return ViewState[SortExpression].ToString();
    }

Gridview排序标头css未加载

2 个答案: