Question

我正在使用jQuery UI进行排序，以使我的表格可以排序。代码不显示任何错误，但可排序功能似乎不起作用。通过这个我的意思是我的元素不重新排序。我从未在mvc（views / razor）项目中使用过这种方法。

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

谢谢。

script type="text/javascript">

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

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

<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>

Answer 1

如果我正确理解你的问题/代码，你想让整个表格行可拖动吗？

它在MVC项目中的事实并不重要。

始终确保页面已准备就绪，您可以使用(document).ready()开始操作元素。

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

这是我认为你想要实现的working jsFiddle。

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

1 个答案: