Question

问题：网格现在向上或向下拖动行。我想保存订单更改，我已搜索但无法找到方法

想法：当我拖动时，我假设我可以在JavaScript / jQuery中获取ID并以这种方式保存更改？

代码：

（VB）

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Grid.aspx.vb" Inherits="Grid" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<!-- Drag and drop feature --> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="jquery.tablednd.js"></script>
<script type="text/javascript">
    $(function () {
        $("#gvDetails").tableDnD();
    })
</script>

<!-- /// Drag and drop feature --> 
</head>
<body>
    <form id="form1" runat="server">
    <div>     
<hr />
<asp:GridView ID="gvDetails" runat="server" AutoGenerateColumns="true" EmptyDataText = "No files uploaded">
    <Columns>
   <asp:BoundField DataField="Text" HeaderText="File Name" />
    </Columns>
</asp:GridView>

    </div>
    </form> 
</body>
</html>

（。aspx.vb）

Imports System.IO
Imports System.Data
Imports System.Collections.Generic

Partial Class Grid
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load

        If Not IsPostBack Then
            BindGridviewData()
        End If
    End Sub

    Protected Sub BindGridviewData()


        Dim filePaths() As String = Directory.GetFiles(Server.MapPath("~/Uploads/"))
        Dim files As List(Of ListItem) = New List(Of ListItem)
        For Each filePath As String In filePaths
            files.Add(New ListItem(Path.GetFileName(filePath), filePath))
        Next

        gvDetails.DataSource = files
        gvDetails.DataBind()

    End Sub

End Class

参考文献：

代码基于：http://www.aspdotnet-suresh.com/2015/03/aspnet-gridview-reorder-rows-with-drag-drop-options-using-jquery-tablednd-plugin.html

搜索（示例）：http://forums.asp.net/t/2042661.aspx?Drag+and+drop+and+save+automatically+with+Datagrids

Answer 1

您可以在调用方法 tableDnD 时捕获事件 onDrop 并保存更改：

$("#gvDetails").tableDnD(
    onDrop: function(table, row) {
        console.log("Save changes");
    }
);

您可以查看此文档：

https://github.com/isocra/TableDnD/blob/master/js/jquery.tablednd.js

或者如果你已经将其解决了，也许这个其他答案可以帮助你：

TableDnD onDrop event not firing

拖放更改后保存对Datagrid的更改

1 个答案: