jQuery表格拖拽排序后如何更新SQL排序值（C# MVC ADO.NET项目）

1. 前端逻辑补全 #

首先在渲染表格行时，给每一个<tr>标签绑定对应记录的主键值，比如渲染时加属性data-id="@item.记录主键名"，后续提交排序时靠这个属性匹配数据库记录。
补全jQuery UI Sortable的初始化代码，新增保存按钮的点击逻辑，拖拽完成后按DOM顺序收集行的主键和新优先级，提交到后端：

// 初始化拖拽排序
$("#tblLookup1 tbody").sortable({
    items: 'tr',
    cursor: 'pointer',
    axis: 'y',
    dropOnEmpty: false,
    start: function (e, ui) {
        ui.item.addClass("selected");
    },
    stop: function (e, ui) {
        ui.item.removeClass("selected");
    }
});

// 保存排序按钮绑定事件，页面上对应加按钮：<button id="btnSavePriority">保存排序</button>
$("#btnSavePriority").on("click", function () {
    const updateData = [];
    // 按当前页面展示顺序遍历行，生成新的优先级
    $("#tblLookup1 tbody tr").each(function (index, row) {
        updateData.push({
            Id: Number($(row).data("id")),
            Priority: index + 1 // 优先级从1开始计数，避免0值排序异常
        });
    });

    $.ajax({
        url: '/对应控制器名/UpdatePriority',
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify(updateData),
        success: function (res) {
            if (res.success) {
                alert("排序保存成功");
            } else {
                alert("保存失败：" + res.message);
            }
        },
        error: function () {
            alert("网络请求异常，请重试");
        }
    });
});

如果不需要手动点按钮，想拖拽完成自动保存，直接把ajax提交的逻辑放到sortable的stop回调里即可。

2. 后端接口实现 #

首先新建一个数据传输类，接收前端传的排序数组：

public class PriorityUpdateParam
{
    public int Id { get; set; }
    public int Priority { get; set; }
}

在对应控制器中添加Post接口处理更新请求：

[HttpPost]
public JsonResult UpdatePriority(List<PriorityUpdateParam> priorityList)
{
    try
    {
        int affectedCount = 数据操作类.BulkUpdatePriority(priorityList);
        return Json(new { success = true, message = $"已更新{affectedCount}条记录排序" });
    }
    catch (Exception ex)
    {
        return Json(new { success = false, message = ex.Message });
    }
}

3. ADO.NET批量更新逻辑 #

批量更新必须加事务，避免中途报错导致部分行更新成功、部分失败，造成排序错乱：

public int BulkUpdatePriority(List<PriorityUpdateParam> priorityList)
{
    int result = 0;
    // 替换为你项目中实际的数据库连接字符串
    string connStr = System.Configuration.ConfigurationManager.ConnectionStrings["你的数据库连接配置名"].ConnectionString;
    using (SqlConnection conn = new SqlConnection(connStr))
    {
        conn.Open();
        SqlTransaction tran = conn.BeginTransaction();
        try
        {
            string sql = "UPDATE 你的业务表名 SET Priority = @Priority WHERE Id = @Id";
            SqlCommand cmd = new SqlCommand(sql, conn, tran);
            // 预定义参数，循环时只改值，减少参数重复创建开销
            cmd.Parameters.Add("@Priority", System.Data.SqlDbType.Int);
            cmd.Parameters.Add("@Id", System.Data.SqlDbType.Int);

            foreach (var item in priorityList)
            {
                cmd.Parameters["@Priority"].Value = item.Priority;
                cmd.Parameters["@Id"].Value = item.Id;
                result += cmd.ExecuteNonQuery();
            }
            tran.Commit();
        }
        catch
        {
            tran.Rollback();
            throw;
        }
    }
    return result;
}

4. 页面初始加载逻辑 #

后续页面加载查询列表数据时，SQL语句增加排序规则ORDER BY Priority ASC，按保存的优先级字段排序后再返回给视图渲染，就能展示调整后的顺序。

注意事项 #

• 数据库中Priority字段设置为int类型，不要用字符串存储排序值，提升排序和更新效率
• 渲染表格行时必须给tr加data-id属性存主键，否则无法匹配数据库记录
• 如果有删除、新增记录的逻辑，新增记录时给Priority赋当前表最大Priority+1的值，避免排序值重复

内容的提问来源于stack exchange，提问作者electro_guy