jquery 可在 asp.net mvc 中排序

jquery sortable in asp.net mvc

每当用户根据他们的偏好对 table 行进行排序时,我正在尝试使用 ajax 发送任务 ID。但是 ajax 中捕获的数据似乎并没有发送到控制器。我已经调试了代码,数据被捕获到 jQuery,但是 ajax 没有发送它。可能是什么问题?这是我的代码。 我的任务索引

<script src="~/Scripts/jquery-ui-1.12.1.min.js"></script>
  @section scripts {
<script type="text/javascript">
 $("#sortable").sortable({
            update: function (event, ui) {
                var itemIds = ""; 
  $("#sortable").find(".taskSingleInline").each(function () 
     {
                     var itemId = $(this).attr("data-taskid");
                     itemIds = itemIds + itemId + ",";
                 });
            $.ajax({
                url: '@Url.Action("UpdateItem", "TaskBoard")',
                data: { itemIds: itemIds },
                type: 'POST',
                success: function (data) {

                },
                error: function (xhr, status, error) {

                }
            });
        }
    });
</script>
}
 <style>
     #sortable tr:hover {
         background-color: cadetblue;
         color: beige;
     }
 </style>


 @using (Html.BeginForm("Index", "TaskBoard", FormMethod.Post))
 {
     <div class="container">
    <div class="col-md-6">
        <table class="table table-bordered">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Position</th>
                </tr>
            </thead>
            <tbody id="sortable" style="cursor:pointer;">
                @foreach (var i in Model)
                {
                    <tr>
                        <td>@i.Id</td>
                        <td class="taskSingleInline" id="task@(i.Id)" data-taskid="@(i.Id)">@i.Name</td>
                        <td>@i.RowNo</td>
                    </tr>
                }
            </tbody>
        </table>

        <button type="submit"> submit</button>
    </div>
</div>
}

这是我的控制器

    public ActionResult UpdateItem(string itemIds)
    {
        int count = 1;         
        List<int> itemIdList = new List<int>();
        itemIdList = itemIds.Split(",".ToCharArray(), StringSplitOptions.RemoveEmptyEntries).Select(int.Parse).ToList();
        foreach( var i in itemIdList)
        {
            try
            {
                First f = TE.Firsts.Where(x => x.Id == i).FirstOrDefault();                  
                f.RowNo = count;
                TE.Firsts.AddOrUpdate(f);
                TE.SaveChanges();
            } catch(Exception)
            {
                continue;
            }
            count++;

        }
        return Json(true, JsonRequestBehavior.AllowGet);
    }

其中 TF 是我的数据库上下文 我的模特 "first" enter image description here

并且我已经在我的共享 _layout 中进行了渲染

 @Styles.Render("~/Content/css")
 @Scripts.Render("~/bundles/modernizr")
 @Scripts.Render("~/bundles/jquery")

事实证明问题出在我的第一次 table 上。我删除了 try-catch 块以查看异常,显然我第一个 table 中的所有字段都被设置为主键?我不记得这样做了,我不知道它是怎么发生的,所以我从除 id 之外的所有字段中删除了身份并且它工作得很好,我希望这在某种程度上有所帮助。