Jquery DataTable中的滚动问题

时间:2013-04-18 07:35:46

标签: jquery jquery-datatables

我不确定我是否在重复这个问题,如果是的话指导正确的地方:)

我正在使用Data表并尝试实现Horizo​​ntal Scrolling并找到此链接

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

我在我的数据表代码中使用了这些属性,并且在UI中遇到了问题。

我的数据得到了水平滚动条,但是我的列没有扩展而且没有按预期工作。我的普通列下面有一个额外的空列。

基本上我的用户界面搞砸了。我看到了一个旧的线程讨论!

DataTables fixed headers misaligned with columns in wide tables

这些问题现在是否已解决?

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

添加示例代码

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

1 个答案:

答案 0 :(得分:22)

我有一个类似的问题,但以不同的方式解决了它。

我修改了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