JQuery Datatables: невозможно прочитать свойство 'aDataSort' undefined

Я создал эту скрипту, и она хорошо работает в соответствии с моими требованиями: Fiddle

Однако, когда я использую то же самое в своем приложении, я получаю сообщение об ошибке в консоли браузера, говоря Не могу прочитать свойство "aDataSort" undefined

В моем приложении javascript читает что-то вроде ниже: я проверил выход контроллера... он хорошо работает и также печатается на консоли.

$(document).ready(function() {

    $.getJSON("three.htm", function(data) {
             // console.log("loadDataTable >>  "+JSON.stringify(data));
             })
             .fail(function( jqxhr, textStatus, error ) {
             var err = textStatus + ', ' + error;
             alert(err);
             console.log( "Request Failed: " + err);
             })
             .success(function(data){
                 loadDataTable(data);
             });

    function loadDataTable(data){
         $("#recentSubscribers").dataTable().fnDestroy();    
         var oTable = $('#recentSubscribers').dataTable({
             "aaData" : JSON.parse(data.subscribers),
             "processing": true,
            "bPaginate": false,
            "bFilter": false,
            "bSort": false,
            "bInfo": false,
            "aoColumnDefs": [{
            "sTitle": "Subscriber ID",
            "aTargets": [0]
        }, {
            "sTitle": "Install Location",
            "aTargets": [1]
        }, {
            "sTitle": "Subscriber Name",
            "aTargets": [2]
        }, {
            "aTargets": [0], 
            "mRender": function (data, type, full) {
                return '<a style="text-decoration:none;" href="#" class="abc">' + data + '</a>';
            }
        }],
            "aoColumns": [{
            "mData": "code"
        }, {
            "mData": "acctNum"
        }, {
            "mData": "name"
        }]
            });

    }       

})

Ответ 1

Важно, чтобы ваш THEAD не был пустым в таблице. Поскольку dataTable требует указать количество столбцов ожидаемых данных. По вашим данным это должно быть

<table id="datatable">
    <thead>
        <tr>
            <th>Subscriber ID</th>
            <th>Install Location</th>
            <th>Subscriber Name</th>
            <th>some data</th>
        </tr>
    </thead>
</table>

Ответ 2

Также была проблема, Этот массив находился за пределами допустимого диапазона:

order: [1, 'asc'],

Ответ 3

Для меня ошибка была в самих DataTables; Код для сортировки в DataTables 1.10.9 не будет проверять границы; Таким образом, если вы используете что-то вроде

order: [[1, 'asc']]

с пустой таблицей нет строки idx 1 → это исключение гарантирует. Это произошло, когда данные для таблицы выбирались асинхронно. Изначально при загрузке страницы dataTable инициализируется без данных. Он должен быть обновлен позже, как только будут получены данные результата.

Мое решение:

// add within function _fnStringToCss( s ) in datatables.js
// directly after this line
// srcCol = nestedSort[i][0];

if(srcCol >= aoColumns.length) {
    continue;
}

// this line follows:
// aDataSort = aoColumns[ srcCol ].aDataSort;

Ответ 4

В моем случае я имел

$('#my_table').empty();

Где это должно было быть

$('#my_table tbody').empty();

Примечание: в моем случае мне пришлось очистить таблицу, так как у меня были данные, которые я хотел удалить, прежде чем вставлять новые данные.

Просто подумал о том, чтобы поделиться тем, где это может помочь кому-то в будущем!

Ответ 5

У меня также есть эта проблема, следующие изменения решили мою проблему.

$(document).ready(function() {
     $('.datatable').dataTable( {
            bSort: false,
            aoColumns: [ { sWidth: "45%" }, { sWidth: "45%" }, { sWidth: "10%", bSearchable: false, bSortable: false } ],
        "scrollY":        "200px",
        "scrollCollapse": true,
        "info":           true,
        "paging":         true
    } );
} );

массив aoColumns описывает ширину каждого столбца и его свойства sortable.

Ответ 6

У меня была эта проблема, и это было потому, что другой сценарий удалял все таблицы и воссоздали их, но моя таблица не была воссоздана. Я потратил целую вечность на эту проблему, прежде чем заметил, что мой стол даже не виден на странице. Можете ли вы увидеть свою таблицу перед инициализацией DataTables?

По сути, другой сценарий делал:

let tables = $("table");
for (let i = 0; i < tables.length; i++) {
  const table = tables[i];
  if ($.fn.DataTable.isDataTable(table)) {
    $(table).DataTable().destroy(remove);
    $(table).empty();
  }
}

И это должно было сделать:

let tables = $("table.some-class-only");
... the rest ...