DataTables使用滚动条调整列无法正常工作

时间:2013-04-24 13:00:34

标签: jquery jquery-plugins datatables jquery-datatables

我想开发一个能够通过单击和拖动来调整列大小的表(我已经使用ColReorderWithResize插件完成了此操作)。

但是,当我使用滚动选项并尝试调整标题列的大小时,在调整标题大小时,表格不会与标题对齐。

这是fiddle script

我想要的是,如果我调整标题列(例如浏览器列)的大小,那么主体列应该与标题列对齐。当我想使用滚动条时,这是ColReorderWithResize中的正常行为吗?

注意我正在使用:

DataTables 1.9.4

ColReorderWithResize 1.0.7

var $table = $("#demo table");
$table.dataTable({
  "sDom": "Rlfrtip",
  "sScrollY":($(window).height() - 300) + "px",

  "fnDrawCallback": function() {
    $(window).unbind('resize').bind('resize', function () {
      that.applyTableHeight();
    });
  },
  applyTableHeight:function () {
    var sScrollY = ($(window).height() - this.staticHeight) + "px";
    $(".dataTables_scrollBody").css("height", sScrollY);
    this.calculateTableWidth();
  }
});

2 个答案:

答案 0 :(得分:1)

试试这个..重绘它将影响的数据表。

$( “#的table_id”)的dataTable()fnDraw();

答案 1 :(得分:0)

$("#tblname").dataTable({
        autoWidth: false,
        oLanguage: {"sZeroRecords": ' ', "sEmptyTable": ' ' },
        select: true,
        scrollY:        500,
        scrollX:        false,
        deferRender:    true,
        scroller:       false,
        paging:   false,
        ordering: false,
        info:     false
    });
 $(window).resize(function() {
        $("#tblname").dataTable().fnDraw();
                 });

如果您使用数据表和滚动插件,这解决了我的问题。