为什么JQuery不呈现此DataTable?

时间:2016-10-31 09:17:29

标签: jquery asp.net-mvc datatables

在社区VS 2015中,我创建了一个新的MVC5项目。

我创建了一个Controller / Model和View。

WebPage的来源如下。我已经尝试了一些我能想到的东西来让JQuery呈现这个数据表。

我已将.DataTable()调用放在表格的HTML之前和之后的各个地方。

似乎没有任何效果。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Trader - My ASP.NET Application</title>
    <link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>

    <script src="/Scripts/modernizr-2.8.3.js"></script>


</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="/">Application name</a>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a href="/">Home</a></li>
                    <li><a href="/Home/About">About</a></li>
                    <li><a href="/Home/Contact">Contact</a></li>
                </ul>
                    <ul class="nav navbar-nav navbar-right">
        <li><a href="/Account/Register" id="registerLink">Register</a></li>
        <li><a href="/Account/Login" id="loginLink">Log in</a></li>
    </ul>

            </div>
        </div>
    </div>
    <div class="container body-content">




<div class="w3-half">
    <h1>Trader overview</h1>

    <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
    <script src="/Scripts/jquery-3.1.1.js"></script>
    <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.css">
    <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $('#example').DataTable();
    });</script>


    <table id="example" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th>Symbol</th>
                <th>ActualPosition</th>
                <th>AccountIdent</th>
            </tr>
        </thead>
        <tbody>

            <tr>
                <td>Juice </td>
                <td>0</td>
                <td>PFreq </td>
            </tr>
            <tr>
                <td>Jenny </td>
                <td>4</td>
                <td>PFreq </td>
            </tr>
            <tr>
                <td>Sigmund </td>
                <td>0</td>
                <td>PFreq </td>
            </tr>


        <tbody>
    </table>



</div>

        <hr />
        <footer>
            <p>&copy; 2016 - My ASP.NET Application</p>
        </footer>
    </div>

    <script src="/Scripts/jquery-3.1.1.js"></script>

    <script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>



<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
    {"appName":"Firefox","requestId":"069e0559754245caae0ddf3e48c38722"}
</script>
<script type="text/javascript" src="http://localhost:64927/d424e4afab0440679cab2690bf9105e0/browserLink" async="async"></script>
<!-- End Browser Link -->

</body>
</HTML>

0 个答案:

没有答案