Gridview sorting up/down arrow in column headers

Question

I'm currently working on some code which is taking care of sorting and paging data in a gridview. I'm now trying to implement sorting arrow (up/down arrows next to column headers) but I have no success. The code to implement the sorting arrows is located in the *GridView1_RowCreated* sub routine. Right now, when I run the code, I don't see the sorting arrows at all. The problematic line is the following one: "If tblAdministrators.SortExpression = lnk.CommandArgument Then" I can't figure out what's wrong with that line. It's always False therefore the arrows don't show up.

Private Function GetData(sort As SortDirection) As Data.DataView

    Dim connection As OracleDBConnect = DAL.GetOracleDBConnection()
    Dim request As OracleDBRequest = Nothing
    Dim result As OracleDBResult = Nothing
    Dim trace As OracleDBChronoTrace = Nothing
    Dim status As DBStatus
    Dim sb As New StringBuilder
    Dim dv As DataView

    With sb
        .Append("SELECT * FROM USERS")
    End With

    request = New OracleDBRequest(sb.ToString, CommandType.Text)

    status = connection.Execute(request, result, trace)

    dv = New DataView(result.DataSet.Tables(0))

    If (ViewState("sortExp") IsNot Nothing) Then
        dv = New Data.DataView(result.DataSet.Tables(0))

        If (GridViewSortDirection = SortDirection.Ascending) Then
            GridViewSortDirection = SortDirection.Descending
            dv.Sort = CType(ViewState("sortExp").ToString() & DESCENDING, String)
        Else
            GridViewSortDirection = SortDirection.Ascending
            dv.Sort = CType(ViewState("sortExp").ToString() & ASCENDING, String)
        End If
    Else
        dv = result.DataSet.Tables(0).DefaultView
    End If

    Return dv

End Function


Public Property GridViewSortDirection() As SortDirection
    Get
        If ViewState("sortDir") Is Nothing Then
            ViewState("sortDir") = SortDirection.Ascending
        End If

        Return CType(ViewState("sortDir"), SortDirection)
    End Get

    Set(ByVal value As SortDirection)
        ViewState("sortDir") = value
    End Set

End Property


Protected Sub GridView1_PageIndexChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewPageEventArgs) Handles tblAdministrators.PageIndexChanging

    tblAdministrators.PageIndex = e.NewPageIndex
    GridViewSortDirection = If(GridViewSortDirection = SortDirection.Descending, SortDirection.Ascending, SortDirection.Descending)
    tblAdministrators.DataSource = GetData(GridViewSortDirection)
    tblAdministrators.DataBind()

End Sub


Protected Sub GridView1_Sorting(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewSortEventArgs) Handles tblAdministrators.Sorting

    ViewState("sortExp") = e.SortExpression
    tblAdministrators.DataSource = GetData(GridViewSortDirection)
    tblAdministrators.DataBind()

End Sub

Protected Sub GridView1_RowCreated(sender As Object, e As GridViewRowEventArgs) Handles tblAdministrators.RowCreated
    If e.Row.RowType = DataControlRowType.Header Then
        For Each tc As TableCell In e.Row.Cells
            If tc.HasControls() Then

                Dim lnk As LinkButton = DirectCast(tc.Controls(0), LinkButton)
                If lnk IsNot Nothing Then

                    Dim img As New System.Web.UI.WebControls.Image()

                    img.ImageUrl = "/images/" & (If(GridViewSortDirection = SortDirection.Ascending, "asc", "desc")) & ".gif"

                    If tblAdministrators.SortExpression = lnk.CommandArgument Then

                        tc.Controls.Add(New LiteralControl(" "))
                        tc.Controls.Add(img)

                    End If
                End If
            End If
        Next
    End If
End Sub

ASPX code:

 <asp:GridView ID="tblAdministrators" runat="server" AutoGenerateColumns="false" EmptyDataText="No records found" PageSize="25" AllowPaging="True" AllowSorting="True" OnRowCreated="GridView1_RowCreated">
        <Columns>
            <asp:BoundField HeaderText="Name" DataField="Name" SortExpression="NAME"></asp:BoundField>
        </Columns>
        <Columns>
            <asp:BoundField HeaderText="City" DataField="City" SortExpression="CITY"></asp:BoundField>
        </Columns>
    </asp:GridView>

Answer 1

Take a look at my sample:

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" 
    AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="CustomerId" 
    DataSourceID="SqlDataSource1">
    <SortedAscendingHeaderStyle CssClass="sortasc" />
    <SortedDescendingHeaderStyle CssClass="sortdesc" />
    <Columns>
        <asp:CommandField ShowSelectButton="True" />
        <asp:BoundField DataField="CustomerId" HeaderText="CustomerId" 
            InsertVisible="False" ReadOnly="True" SortExpression="CustomerId" />
        <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
        <asp:BoundField DataField="IdNumber" HeaderText="IdNumber" 
            SortExpression="IdNumber" />
    </Columns>
</asp:GridView>

Pay attention on SortedAscendingHeaderStyle and SortedDescendingHeaderStyle. Just create apropriate css classes with background image (arrow up and arrow down) and you are done.