0

datatable.net の水平スクロールは、スクロール時にヘッダーを実際の列データに揃えません。スクロールすると、テーブルの本文は移動しますが、ヘッダーは移動しません。ヘッダーをスクロール可能に設定したい。

私のコードサンプル ::--------

 $('#abc').dataTable({
                "aaData": userContactGridData,
                "bAutoWidth":false,
                "aoColumnDefs": [
                    { "bSortable": false, "aTargets": ["icon", "adminRoleIcon", "gearIcon"] },// disable sorting on first and last column
                    { "sWidth": "20px", "aTargets": ["icon", "gearIcon"] },
                    { "sWidth": "200px", "aTargets": ["userName"] },
                    { "sClass": "icon", "aTargets": ["icon"] },
                    { "sClass": "gearIcon", "aTargets": ["gearIcon"] },
                    { "sClass": "userName", "aTargets": ["userName"] },
                    { "sClass": "adminRoleIcon", "aTargets": ["adminRoleIcon"] },
                    { "bVisible": false, "aTargets": ["adminRoleIcon"] },
                ],
                "sDom": 'C<"H"Tfr>t<"F"ip>',
                "iDisplayLength": 6,
                "bProcessing": true,
                "bJQueryUI": true,
                "sPaginationType": "full_numbers",
                "aaSorting": [[2, "asc"]], // sort by name by default
                "sScrollX": "100%",
                "bScrollCollapse": true
                });
4

1 に答える 1

2

追加sScrollX: 100%し てみてくださいbScrollCollapse: true

次に、コードは次のようになります

    var oTable;
    $(document).ready(function () {
      oTable = $("#yourElementName").dataTable({
               "sScrollX": "100%",
               "bScrollCollapse": true,
               "bJQueryUI": true,
               "sPaginationType": "full_numbers",
               "aoColumnDefs": [{ "aTargets": [0], "bSortable": true },
                                 { "aTargets": ['_all'], "bSortable": false}], 
                                  "aaSorting": [[0, 'asc']]
                    
                });
    
                setTimeout(function () {
                    oTable.fnAdjustColumnSizing();
                }, 10);
    
            });
于 2013-10-16T10:50:40.030 に答える