DataTables 在 asp.net mvc 4 中不工作

Question

我正在尝试使用 asp.net mvc 4 和 EF6 创建一个网站，用户可以在其中使用来自客户端的排序、分页和过滤 table。我正在为这些功能使用 DataTables 1.10.4 jQuery 插件。到目前为止，所有内容都已完美加载，但如果我单击 <th> 内容，列不会得到排序，无论我在筛选框中键入什么，筛选都不起作用。我在浏览器控制台中没有看到任何错误。这是我的代码，

控制器

public ActionResult UserLogin()
    {
        if (Session["UserNAME"] != null)
        {
            var mkimodel = new MkistatVsUserLogin { mkistats = db.mkistats.ToList() };
            return View(mkimodel);
        }
        else
        {
            return RedirectToAction("Home");
        }
    }

查看

<table id="mktTable" class="table">
<thead>
<tr>
    <th>CodeName</th><th>% Change</th><th>High Price</th><th>Open Price</th><th>Total Value</th>
</tr>
</thead>
@foreach (var item in Model.mkistats)
{
<tbody>
<tr>
    <td>
        @Html.DisplayFor(modelItem => item.MKISTAT_CODE)
    </td>
    <td>
        5%
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.MKISTAT_HIGH_PRICE)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.MKISTAT_OPEN_PRICE)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.MKISTAT_TOTAL_VALUE)
    </td>        
</tr>
</tbody>
}
</table>

_Layout.cshtml

<head>
<link href="~/Content/jquery.dataTables.css" rel="stylesheet" />
</head>

<body>
    <script src="~/Scripts/jquery-1.9.1.min.js"></script>
    <script src="~/Scripts/bootstrap.min.js"></script>
    <script src="~/Scripts/DataTables-1.10.4/jquery.dataTables.min.js"></script>
    <script>
        $(document).ready(function () {
            $('#mktTable').DataTable();
        });        
    </script>
    @RenderBody()
    @RenderSection("scripts", required: false)
</body>

我的代码有问题吗？我怎样才能让 dataTables 工作？非常需要这个帮助。 Tnx.

Answer 1

将此添加到您的数据中table 初始化代码。

$('#mktTable').DataTable({
"aoColumns": [
{ "bSortable": true },
{ "bSortable": true },
{ "bSortable": true },
{ "bSortable": true }
]
});

在这里，您必须添加与 table 中一样多的列。您还可以通过设置 "bsortable":false 来禁用对特定列的排序。每列都指向 table.For 示例中的列索引，如果您想禁用对第一列的排序，您将这样写

$('#mktTable').DataTable({
"aoColumns": [
{ "bSortable": false },
{ "bSortable": true },
{ "bSortable": true },
{ "bSortable": true }
]
});

编辑

您已经在 foreach 循环中写入了 tbody 标签。从 foreach 循环中取出这个。

DataTables 在 asp.net mvc 4 中不工作

DataTables not working in asp.net mvc 4

asp.net

asp.net-mvc

jquery

jquery-datatables