Question

以下是我的cshtml视图文件中的完整代码。

我得到了一个带有格式化表格的好网页。

但它没有被JQuery.Datatable格式化。我可以删除所有脚本行，但它看起来仍然相同。

我可能做错了什么。我没有得到任何与JQuery相关的构建错误。

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Employee Index Page</title>

    <script type="text/javascript" language="javascript" src="~/Scripts/jquery-1.10.2.js">
    </script>
    <script type="text/javascript" language="javascript" src="~/Scripts/DataTables/jquery.dataTables.js">
    </script>

    <script >
        $(document).ready(function() {
        $('#example').DataTable();
                } );
    </script>
</head>
<body>
    <div>
        <h1>Employee Index Page</h1>
        <table id="example" class="display" cellspacing="0" width="100%">
            <thead>
                <tr>
                    <th>Symbol</th>
                    <th>ActualPosition</th>
                    <th>AccountIdent</th>
                </tr>
            </thead>
            <tbody>

                @{
                    var categories = (DataTable)ViewData["MyData"];

                    foreach (DataRow item in categories.Rows)
                    {
                        string symbol = item.Field<string>("Symbol");
                        string actualPositionText = item.Field<long>("ActualPosition").ToString();
                        string accountIdent = item.Field<string>("AccountIdent");

                        <tr>
                            <td>@symbol </td>
                            <td>@actualPositionText</td>
                            <td>@accountIdent </td>
                        </tr>
                    }
                }
            <tbody>
        </table>


    </div>

</body>
</html>

Answer 1

我试图重现这一点，但我一直无法做到这一点。

请查看this fiddle。它包含与您的示例相同的代码，唯一的区别是jquery和datatable脚本是从CDN引用的，它可以工作！

所以，我认为你可能会遇到一些与你正在服务的本地文件有关的问题。

希望这有帮助！

Answer 2

尝试将dataTables示例html添加到您的页面，以排除任何mvc或HTML语法错误。

Answer 3

您的视图错过了CSS文件

<head>
   <meta name="viewport" content="width=device-width" />
   <title>Employee Index Page</title>
   <link href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css" />
</head>

为什么JQuery.Datatable没有渲染而且没有出错？

3 个答案: