jQuery Datatables：未定義のプロパティ 'aDataSort'を読み取れません

私はこのフィドルを作成し、それは私の要件に従ってうまく機能します：フィドル

ただし、アプリケーションで同じものを使用すると、ブラウザコンソールに、未定義のプロパティ 'aDataSort'を読み取れませんというエラーが表示されます。

私のアプリケーションでは、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自体にありました。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();

注：私の場合、新しいデータを挿入する前に削除したいデータがあったため、テーブルを空にする必要がありました。

それが将来誰かを助けるかもしれない場所を共有することを考えただけです！

この問題が発生したのは、別のスクリプトがすべてのテーブルを削除して再作成していたためですが、テーブルが再作成されていませんでした。私のテーブルがページに表示されていないことに気付く前に、私はこの問題に何年も費やしました。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 ...

解析のため、一[']重引用符を二重引用符に切り替える必要が["]あります

あなたが使用している場合は、データ次の表に属性を、このようにそれを使用しますdata-order='[[1, "asc"]]'

私の場合order、データテーブルを構成するスクリプト内でプロパティを適用するときに有効な列番号を設定することで問題を解決しました。

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