如何让我的asp.net gridview能够排序?

时间:2014-09-16 12:40:19

标签: c# asp.net sorting gridview

好的,所以这是我几个小时以来一直在努力的重大问题。

我得到了我的gridview,并且我得到了一个总是保持在顶部的标题,我使用jQuery作为标题,我在顶部始终不会从gridview获取超链接允许排序。

我知道我可以通过添加:ORDER BY ColumnName对gridview进行排序。但我不知道如何创建点击事件或如何显示箭头(如果可能),以便您可以看到它是上升还是下降。此外,如果您单击它,它将从升序/降序

更改

我的代码到目前为止:

Side.aspx

            <div id="GHead"></div>
            <div style="overflow: auto; height: 100%">
                <asp:GridView ID="GridView1" runat="server" AllowSorting="true" AutoGenerateColumns="false" BackColor="White" Width="100%" BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px" CellPadding="4" AutoGenerateSelectButton="true" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
                    <Columns>
                        <asp:BoundField HeaderText="ID" DataField="ID" />
                        <asp:BoundField HeaderText="Tildelt" DataField="Tildelt" />
                        <asp:BoundField HeaderText="Firma" DataField="Firma" />
                        <asp:BoundField HeaderText="Kontakt" DataField="Kontakt" />
                        <asp:BoundField HeaderText="Svar" DataField="Svar" />
                        <asp:BoundField HeaderText="Emne" DataField="Emne" />
                        <asp:BoundField HeaderText="Due Date" DataField="DueDate" />
                        <asp:BoundField HeaderText="Prioritet" DataField="Prioritet" />
                        <asp:BoundField HeaderText="Status" DataField="Status" />
                        <asp:BoundField HeaderText="Lukke Dato" DataField="Lukke Dato" />
                    </Columns>
                    <FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
                    <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" />
                    <PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
                    <RowStyle BackColor="White" ForeColor="#330099" />
                    <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />
                    <SortedAscendingCellStyle BackColor="#FEFCEB" />
                    <SortedAscendingHeaderStyle BackColor="#AF0101" />
                    <SortedDescendingCellStyle BackColor="#F6F0C0" />
                    <SortedDescendingHeaderStyle BackColor="#7E0000" />
                </asp:GridView>
            </div>

jQuery代码

<script src="../Scripts/jquery-1.7.1.js"></script>
<script lang="ja">
    $(document).ready(function () {
        var gridHeader = $('#<%=GridView1.ClientID%>').clone(true); //clone copy of gridview with style
        $(gridHeader).find("tr:gt(0)").remove(); // removes all rows except first row
        $('#<%=GridView1.ClientID%> tr th').each(function (i) {
            //sets width of each th from gridview
            $("th:nth-child("+(i+1)+")",gridHeader).css('width', ($(this).width() + 1).toString() + "px");
        });
        $("#GHead").append(gridHeader);
        $('#GHead').css('position', 'absolute');
        $('#GHead').css('top', $("#<%=GridView1.ClientID%>").offset().top);

    });
</script>

我从互联网上获得了所有jQuery。

这就是现在的样子。 enter image description here

2 个答案:

答案 0 :(得分:0)

使用AllowSorting属性做你想做的事情,当框架具有标准功能时,不要使用jQuery之类的第三方工具。

例如:

<asp:GridView ID="SomeGridView" AutoGenerateColumns="False" runat="server" Width="100%" AllowPaging="True"
    PageSize="50" AllowSorting="True" OnPageIndexChanging="SomeGridView_OnPageIndexChanging"
    OnSorting="SomeGridView_OnSorting" OnRowDataBound="SomeGridView_OnRowDataBound">

答案 1 :(得分:0)

好的,我找到了一个如何使它们可点击的解决方案。他们不是自动生成的,我需要为每个边界域放入SortExpression。

自己没找到,我发现this Link就像我一样有问题并且有答案。