Заполнение JQuery DataTable в MVC SPA - PullRequest
Новая
       6

Заполнение JQuery DataTable в MVC SPA

0 голосов
/ 10 октября 2019

Я хочу заполнить таблицу данных JQuery данными из моего контроллера. Ниже мой JQuery и cshtml ... что мне здесь не хватает? 

<div id="table1">
    <table id="example" class="display">
    </table>
</div>
<br />
<div class="text-center">
    <h1>Pre API Checks</h1>
    <div class="btn-group">
        <button type="button" id="btnTapCountCheck">TC Check</button>
    </div>
</div>

$("#btnTapCountCheck").click(function () {
    $('#example').DataTable({
        ajax: {
            url: '@Url.Action("GTC", "TC")',
            method: "GET"
        },
        columns: [
            { data: "Location" },
            { data: "TC" }
        ]
    });
});

РЕДАКТИРОВАТЬ
При событии нажатия кнопки я получаю эту ошибку в консоли 

Uncaught TypeError: $(...).DataTable is not a function
at HTMLButtonElement.<anonymous> (site.js?v=z24mdPOuYS…NZryPIzfHbE3qOQ2M:6)
at HTMLButtonElement.dispatch (jquery.js:5183)
at HTMLButtonElement.elemData.handle (jquery.js:4991)
(anonymous)    @    site.js?v=z24mdPOuYS…NZryPIzfHbE3qOQ2M:6
dispatch    @    jquery.js:5183
elemData.handle    @    jquery.js:4991

И в моем _Layout.cshtml Iдобавить эти две ссылки. 

<head>
  <link href="//cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" />
  <script src="//cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
</head>

1 Ответ

0 голосов
/ 10 октября 2019

Кажется, что ваш код не может найти JS для Datatables. Попробуйте изменить ссылки на DataTables.

Попробуйте заменить тег head на: 

<head>
    <link rel="stylesheet" href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css"></style>
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> 
</head>

и теги script (обычно в нижней части HTML) на: 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

Не увидев ваш полный код, мне будет сложно полностью протестировать что-либо, но заменить эти теги и посмотреть, если вы получите ту же ошибку.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...