jQueryのDataTableのとJScrollPaneの - テーブルのヘッダーは、私が右にテーブルをスクロールしたときに、私は...それがうまくいったが、1つの事、jqueryのDataTableのを持っており、JScrollPaneには一緒に仕事を</p> <p>を試してみました

Question

をスクロールしない、ヘッダーは」doesnの一緒になっているようだ。ここ

は私のhtmlの私のコードスニペットです：

$("#my-table").dataTables({ 
    // ... 
    "sScrollX": "100%", 
    "sScrollXInner": "150%", 
    "fnDrawCallback": function(){ 
     $('.dataTables_scrollBody').jScrollPane(); 
    } 
}); 

誰もがアイデアを持っているのでしょうか？

任意の助けをいただければ幸いです:)

感謝を...

Answer 1

この答えはすでに少し古いですが、私はちょうど同じ問題を抱えていました。私は解雇されたjScrollPaneイベントを使って解決しました。表の本文がスクロールすると、このイベントが通知され、表のヘッダーが手動で正しい位置に設定されます。

$('table.selection_list').dataTable({ 
    sScrollY: '300px', 
    sScrollX: '100%', 
    sScrollXInner: '320%', 
    bPaginate: false, 
    bInfo: false, 
    bFilter: false, 
    "fnInitComplete": function() { 
    var table_header, 
     _this = this; 
    table_header = $('.dataTables_scrollHeadInner').css('position', 'relative'); 
    $('body.admin.selections_index').find('.dataTables_scrollBody').bind('jsp-scroll-x', function(event, scrollPositionX, isAtLeft, isAtRight) { 
    table_header.css('right', scrollPositionX); 
    }).jScrollPane(); 
    } 
}); 

Answer 2

私はbScrollInfiniteを使用し、コードを少し変更しています：

fnDrawCallback: function() { 
      table_header = $('.dataTables_scrollHeadInner').css('position', 'relative'); 
      $('body').find('.dataTables_scrollBody').bind('jsp-scroll-y', 
      function(event, scrollPositionY, isAtTop, isAtBottom) { 
       table_header.css('bottom', scrollPositionY); 
      }).jScrollPane({ 
       verticalDragMinHeight: 15, 
       verticalDragMaxHeight: 15, 
       autoReinitialise: true 
      }); 
     } 

しかし、私は、テーブルの端に午前と別のデータセットをロードすること、テーブルを伝える方法を知りません： （