Ошибка типа: $ (…). DataTable не является функцией

Я получил эту ошибку, потому что обнаружил, что я дважды ссылался на jQuery.

Первый раз: на главной странице (_Layout.cshtml) в ASP.NET MVC, а затем снова на одной текущей странице, поэтому я прокомментировал ее на главной странице.

Если вы используете ASP.NET MVC, этот фрагмент может помочь вам

@*@Scripts.Render("~/bundles/jquery")*@//comment this line 
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)

и на текущей странице я добавил эти строки

<script src="~/scripts/jquery-1.10.2.js"></script>

<!-- #region datatables files -->
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" />
<script src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<!-- #endregion -->

Надеюсь, что это поможет вам, даже если не использовать ASP.NET MVC

Это сработало для меня. Но обязательно загрузите jquery.js перед предпочтительным файлом dataTable.js. Ура!

<script type="text/javascript" src="~/Scripts/jquery.js"></script>
<script type="text/javascript" src="~/Scripts/data-table/jquery.dataTables.js"></script>

 <script>$(document).ready(function () {
    $.noConflict();
    var table = $('# your selector').DataTable();
});</script>

если по какой-либо причине загружены две версии jQuery (что не рекомендуется), вызов $.noConflict(true) из второй версии вернет переменные jQuery с глобальной областью видимости для переменных первой версии.

Иногда это может быть проблема со старой версией (или не стабильной) файлов JQuery

Решение использовать $.noConflict();

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.dataTables.js" type="text/javascript"></script>
<script>
$.noConflict();
jQuery( document ).ready(function( $ ) {
    $('#myTable').DataTable();
});
// Code that uses other library $ can follow here.
</script>

Вот полный набор JS и CSS, необходимый для плагинов таблицы экспорта, чтобы работать отлично.

Надеюсь, это сэкономит ваше время

   <!--Import jQuery before export.js-->
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>


    <!--Data Table-->
    <script type="text/javascript"  src=" https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript"  src=" https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>

    <!--Export table buttons-->
    <script type="text/javascript"  src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
    <script type="text/javascript" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/pdfmake.min.js" ></script>
    <script type="text/javascript"  src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/vfs_fonts.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.4/js/buttons.html5.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.1/js/buttons.print.min.js"></script>

<!--Export table button CSS-->

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">

JavaScript для добавления кнопок экспорта в таблицу с id = tbl

  $('#tbl').DataTable({
                        dom: 'Bfrtip',
                        buttons: [
                            'copy', 'csv', 'excel', 'pdf', 'print'
                        ]
                    });

Результат: -

Для этой ошибки могут быть две причины:

Первая

Вы loding jQuery.DataTables.js до jquery.js, поэтому для этого: -

Вам нужно загрузить jquery.js перед загрузкой jQuery.DataTables.js

Второй

Вы используете две версии jquery.js на той же странице, чтобы: -

Попробуйте использовать более высокую версию и убедитесь, что обе ссылки имеют одну и ту же версию jQuery