Javascript jquery可排序，表和tr宽度在aps.net mvc视图中不起作用

我使用jQueryUISortable使我的表格网格可排序。代码未显示任何错误，但可排序函数似乎不起作用。我的意思是我的元素没有重新排序。我从未在mvc（视图/剃刀）项目中使用过这种方法

如果有人能给我一些指导或帮助，我将不胜感激

多谢各位

script type="text/javascript">

$('td, th', '#MenuItem').each(function () {
    var cell = $(this);
    cell.width(cell.width());
});

$('#MenuItem tbody').sortable().disableSelection();

产品代码
产品样板
描述
行动
@foreach（Model.IndexListitem中的var项）
{
@DisplayFor（modelItem=>item.ProductCode）
@DisplayFor（modelItem=>item.ProdeTemplate.Description）
@DisplayFor（modelItem=>item.Description）
@ActionLink（“，”编辑“，”新建{id=item.ProdeID}，新建{title=“Edit”，@class=“锚图标无文本编辑”}）
@ActionLink（“，”Details“，”new{id=item.ProdeID}，new{title=“Details”，@class=“anchor icon no text Details”}）
@ActionLink（“，”Delete“，new{id=item.ProdeID}，new{title=“Delete”，@class=“锚图标无文本删除”}）
}

如果我正确理解了您的问题/代码，您想让整个表行都可以拖动吗

事实上，它在MVC项目中并不重要

始终确保页面已准备就绪，可以开始使用操作元素

以下是我认为你正在努力实现的目标

<table id = "MenuItem"  class="promo full-width alternate-rows" style="text-align: center;">  
            <tr>
                <th>Prode Code
                </th>
                <th>ProdeTemplate
                </th>
                <th>Description <!-- JACK EDIT -->
                </th>
                <th>Action</th>
            </tr>
            <tbody>
            @foreach (var item in Model.IndexListitem)
            {


                <tr>
                    <td class="center-text">
                        @Html.DisplayFor(modelItem => item.ProductCode)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ProdeTemplate.Description)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Description)
                    </td>

                    <td class="center-text nowrap">
                        @Html.ActionLink(" ", "Edit", new { id = item.ProdeID }, new { title = "Edit", @class = "anchor-icon-no-text edit" })
                        @Html.ActionLink(" ", "Details", new { id = item.ProdeID }, new { title = "Details", @class = "anchor-icon-no-text details" })
                        @Html.ActionLink(" ", "Delete", new { id = item.ProdeID }, new { title = "Delete", @class = "anchor-icon-no-text delete" })
                    </td>
                </tr>

            }

                </tbody>

        </table>

$(document).ready(function() {
    $('#MenuItem tbody').sortable().disableSelection();
});