2016-09-28 22 views
0

Webアプリケーションで応答拡張機能を持つDataTableを使用していますが、質問があります。応答可能で特定のオプションを設定するデータ型

テーブルが応答すると、ページ設定オプションが非表示になります。

私は "bLengthChange" でこれを試してみました:偽:

$(function() { 
     $("#table1").DataTable({ 
      "language": { 
       "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Dutch.json" 
      }, 
      "order": [[1, "asc"]], 
      "bAutoWidth": false, 
      responsive: { 
       details: { 
        type: 'column' 
       }, 
       "bLengthChange": false 
      }, 
      columnDefs: [ { 
       className: 'control', 
       orderable: false, 
       targets: 0 
      } ], 
     }); 
    }); 

しかし、これは動作しません。私の目標は、全画面でページ分割量のドロップダウンメニューを見ることができますが、応答性がある場合はそのオプションを非表示にする必要があります。

"応答性"状態に固有のbLengthChangeのようなオプションを追加できますか?

答えて

1

「応答性の高い」 状態に固有のbLengthChangeのようなオプションを追加できますか?

いいえ、できません。もう一度$.fn.dataTable.Responsive.defaultsを調べてみてください。応答性のある拡張子は、の拡張子であり、lengthMenuはコア機能です。 lengthMenuを非表示にするには、テーブルを再初期化するか、他の機能やその他の拡張機能と競合する可能性があります。しかし、あなたは自分でハックすることができます。 responsive-resizeイベントをフックし、応答性の状態に応じてlengthMenuを非表示にしたり、表示さ:

table.on('responsive-resize', function (e, datatable, columns) { 
    var $lengthMenu = $('.dataTables_length') 
    var count = columns.reduce(function (a,b) { 
    return b === false ? a+1 : a; 
    }, 0); 
    if (count>0 && $lengthMenu.is(':visible')) $lengthMenu.hide() 
    if (count<= 0 && !$lengthMenu.is(':visible')) $lengthMenu.show() 
}); 

デモ - >http://jsfiddle.net/v1dnxLkg/

0

ありがとうございました。

このCSSでそれを修正:

@media screen and (max-width: 767px){ 
    div.dataTables_wrapper > div.row > div > div.dataTables_length{ 
     display: none; 
    } 
} 
関連する問題