Question

我有一个数据库表，其中包含两个字段ColumnName和SortOrder。

我正在使用gridview在C＃.NET Web应用程序的页面上显示ColumnName字段。

我希望用户能够通过拖放gridview行来重新排序行，然后通过将新行号插入数据库表的SortOrder字段中将此新订单保存到数据库中。

我已设法使用JQueryUI Sortable使拖放功能正常工作。但我正在努力获得行服务器端的新订单，以便我可以将它放入数据库。

Gridview代码

<asp:GridView ID="GV_ColumnNames" runat="server" CssClass="sortable">
    <Columns>
        <asp:BoundField DataField="ColumnName" HeaderText="ColumnName" SortExpression="ColumnName" />
    </Columns>
</asp:GridView>

JQuery的

    $(function () {

        $(".sortable").sortable({
            items: "tr:not(tr:first-child)",
            axis: "y"
        }).disableSelection();

    });

作为一个测试，看看我是否可以获得新的行顺序客户端我在下面写了C＃代码，但这只是输出原始行顺序。

    protected void BTN_Confirm_Click(object sender, EventArgs e)
    {
        string orderTest = "";

        foreach(GridViewRow row in GV_FlatFileColumnSetting.Rows)
        {
            orderTest += row.Cells[0].Text;
        }

        Response.Write(orderTest);

    }

有没有人对如何从客户端到服务器端获取行顺序有任何想法，所以我可以运行SQL命令将新订单插入数据库？

非常感谢任何帮助。

Answer 1

jquery可排序为每次删除元素时触发的更新事件。它还有一个toArray方法，它按照它们当前出现的顺序返回元素的id数组。使用AJAX，你可以做这样的事情来调用服务器端代码。这会将id数组作为json字符串传递，需要在服务器端进行解码。

$(function () {
  $(".sortable").sortable({
    items: "tr:not(tr:first-child)",
    axis: "y",
    update: function(event, ui) {
      var sortedIDs = $(event.target).sortableGrid( "toArray" );
      $.ajax({
        url: your url,
        data: JSON.stringify(sortedIDs)
      });
    }
  }).disableSelection();
});

抱歉，我不懂.NET，所以我无法帮助你服务器方，但希望这会有所帮助。

如何在使用JQuery Sortable重新排序后将.NET Gridview行顺序保存到数据库

1 个答案: