JQuery Datatables: Не вдається прочитати властивість 'aDataSort' з undefined

Я створив цю скрипку, і вона працює добре відповідно до моїх вимог: Скрипка

Однак, коли я використовую те саме в моїй програмі, на консолі браузера з'являється повідомлення про помилку " Не вдається прочитати властивість" 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"
        }]
            });

    }       

})

Важливо, щоб 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>

Також мала цю проблему, цей масив вийшов за межі діапазону:

order: [1, 'asc'],

Для мене помилка була в самій таблиці даних; Код для сортування в 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;

Я зіткнувся з тією ж проблемою, наступні зміни вирішили мою проблему.

$(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властивості.

Інша річ, про яку слід згадати цю помилку, також з’явиться, коли ви впорядкуєте номер стовпця, який не існує.

У моєму випадку у мене було

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

Де це мало бути

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

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

Просто подумав поділитися тим, де це "може" допомогти комусь у майбутньому!

У мене була ця проблема, і це тому, що інший сценарій видаляв усі таблиці та відтворював їх, але моя таблиця не відтворювалася. Я витратив цілі віки на це питання, перш ніж помітив, що моєї таблиці навіть не було видно на сторінці. Чи можете ви побачити свою таблицю перед ініціалізацією таблиць даних?

По суті, робив інший сценарій:

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 ...

Вам потрібно замінити одинарні лапки [']на подвійні лапки ["]через синтаксичний розбір

якщо ви використовуєте атрибут порядку даних у таблиці, використовуйте його таким чиномdata-order='[[1, "asc"]]'

У моєму випадку я вирішив проблему, встановивши дійсний номер стовпця під час застосування orderвластивості всередині сценарію, де ви налаштовуєте таблицю даних.

var table = $('#mytable').DataTable({
     .
     .
     .
     order: [[ 1, "desc" ]],