web-dev-qa-db-ja.com

Jquery DataTableのスクロールの問題

はい、正しい場所へのガイドがある場合、私は質問を繰り返しているかどうかわかりません:)

私はデータテーブルを使用しており、水平スクロールを実装しようとしていますが、このリンクを見つけました

http://www.datatables.net/examples/basic_init/scroll_x.html

データテーブルコードでこれらのプロパティを使用していて、UIで問題が発生しています。

データに水平スクロールバーが表示されましたが、列が拡張されず、期待どおりに機能しませんでした。通常の列の下に空の列が追加されました。

基本的に私のUIはめちゃくちゃです。私は古いスレッドのディスカッションを見ました!

DataTablesの固定ヘッダーは、幅の広いテーブルの列とずれています

これらの問題は解決されましたか?

================================

サンプルコードを追加する

$("#results").dataTable({
    "aaData": [
        //My data
    ],
    "aoColumns": [
        //My Columns
    ],
    "bPaginate": true,
    "bSort": true,
    "bFilter": false,
    "bJQueryUI": false,
    "bProcessing": true,
    "sScrollX": "100%",
    "sScrollXInner": "110%",
    "bScrollCollapse": true
});
13
user2067567

同様の問題がありましたが、別の方法で解決しました。

テーブルを余分なsDomでラップするようにdivパラメータを変更しました:

sDom: 'r<"H"lf><"datatable-scroll"t><"F"ip>',

次に、以下のスタイルを.datatable-scrollクラスに適用しました。

/**
 * Makes the table have horizontal scroll bar if its too wide for its container
 */
.datatable-scroll {
    overflow-x: auto;
    overflow-y: visible;
}

http://datatables.net/usage/options#sDom

24
Petah