web-dev-qa-db-ja.com

Uncaught TypeError:undefinedのプロパティ 'aDataSort'を読み取れません

私はページネーションに取り組んでいて、 DataTables pluginを使用していますが、一部のテーブルでは機能しますが、一部のテーブルではエラーが発生します。

Uncaught TypeError:undefinedのプロパティ 'aDataSort'を読み取れません

私のページスクリプトは次のようになります:

$(document).ready(function() {
     $('.datatable').dataTable( {
        "scrollY":        "200px",
        "scrollCollapse": true,
        "info":           true,
        "paging":         true
    } );
} );

// HTMLコード

<table class="table table-striped table-bordered datatable">
   <thead>
        <tr>
          <th><?php echo lang('date_label')?></th>
          <th><?php echo lang('paid_label')?></th>
          <th><?php echo lang('comments_label');?></th>
        </tr>
   </thead>
   <tbody>
      <?php foreach ($payments as $pay): ?>
      <tr>
        <td><?php echo dateformat($pay['time_stamp'], TRUE);?></td>
        <td><?php echo format_price($pay['amount']);?></td>
        <td><?php echo $pay['note'];?></td>
      </tr>
      <?php endforeach?>
   </tbody>
</table>

問題がどのように発生するかはわかりませんが、これは非常に一般的なエラーであることはわかっていますが、検索しても問題をサポートするものは何も見つかりませんでした。
誰かが解決策を知っていますか?

8
Abdul Manan

コードで次のようなものを使用して、DataTablesでの並べ替えを無効にします(最新のDataTablesを使用する私のプロジェクトから適応)

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

aoColumns配列は各列の幅とそのsortableプロパティを記述し、必要に応じて独自のテーブル(数)の列に合わせて調整します。

9
Nikos M.

私は同じ問題に直面し、後でcolumnDefsの下の "targets"プロパティにタイプミスを発見しました。以下の例を参照してください、

以下の間違ったコード、

{
 "name": "firstName",
 "target": [1],
 "visible": false
}

修正-ターゲットでの「s」の欠落:(

{
 "name": "firstName",
 "targets": [1],
 "visible": false
}

このエラーは、何らかの原因で列が初期化されていない場合に発生するようです。この場合、イベント「preInit.dt」が発生しないことを確認しました。

これが誰かを助けることを願っています。

5
pgcan

JavaScriptがDataTableを適用しようとしたときに列がまだ定義されていなかったため、KnockoutJSを使用してこの問題に遭遇しました。 knockoutJSでの私のアプローチは、データバインドコードをノックアウトテンプレートに移動し、afterRenderイベントを使用してDataTableをテーブルに適用することでした。

これは、テンプレートafterRenderイベントの knockoutJS docs へのリンクです。

データバインドは次のようになります。

<div data-bind="template: { name: 'schedule-table', data: $data, afterRender: setupDataTable }"></div>

もう1つのトリックがありました。 setupDataTable関数では、テーブルはまだ完全にセットアップされていません(fixedHeadersを取得しようとしていて、幅はまだセットアップされていませんでした)。したがって、コードを最初のアイドルサイクルで実行するために、0ミリ秒の遅延でsetTimeoutを呼び出しました。

これが私のsetupDataTableです:

function setupDataTable() {
    setTimeout(function() {
        $("#schedule").DataTable({fixedHeader: true});
    }, 0);
}

これが他の誰かがknockoutJSソリューションを探していて、私が遭遇した同じ問題に遭遇するのを助けることを願っています。

3
Greg Veres

このエラーが表示されたのは、私の「mData」と「sTitle」が未定義だったからだと思います。

1
maia