Question

我正在使用jQuery UI进行排序，以使我的表格可以排序。但是我的元素仍然没有重新排序，也没有显示错误。我从未在asp.net mvc中使用过这种方法。

很高兴收到一些指导，谢谢。

<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

我对@Html and @foreach注释并不熟悉。但是，我认为这些注释是在服务器端处理的。所以基本上你试图通过jquery选择一些尚未生成的html元素。

一种解决方案是将整个以下代码块放在document.ready block

中

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

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

});

jquery可排序函数在视图中不起作用（mvc）

1 个答案: