0

关于 DataTables 的保存滚动位置,我一直在网上四处寻找几个小时,但没有任何运气。至少对我来说不是。

根据数据表,要保存滚动条的状态,我需要这行代码:

    $(document).ready(function() {
    var oTable = $('#example').dataTable( {
        "sScrollY": "200px",
        "sAjaxSource": "media/data/2500.txt",
        "sDom": "frtiS",
        "bDeferRender": true,
        "bStateSave": true
    } );
} );

但是由于我没有任何包含可以解析的数据的文本文件,所以它不起作用。我正在使用 PHP 和 MYSQL 获取表中的数组。
除了滚动条之外,它"bStateSave": true确实保存了每个用户输入,例如过滤和排序。

有谁知道如何解决这个问题?

编辑 好吧,我设法让这个工作。看来我有一些真实的东西,这不应该是。现在,有了这个"sDom"滚动工作的保存状态,但我的 GUI 不见了......

编辑 我的启动代码是:

<!-- DATATABLES ENABLE INIT -->
<script>
<?php include ('js/datatables/ordernumhtml.js');?>
<?php include ('js/datatables/ordercurrency.js');?>
<?php include ('js/datatables/dataTables.scroller.min.js');?>
    $(document).ready( function () {
        $('#table1').dataTable( {
        "sDom": "frtiS",
        "bDeferRender": false,
        "bStateSave": true,
        "bAutoWidth": true,
        "bInfo": true,
        "sScrollX": "100%",
        "bScrollCollapse": true,
        "bScrollAutoCss": true,
        "bScrollInfinite": false,
        "sScrollY": "350px",
        "bJQueryUI": true,
        "bProcessing": true,
        "aoColumns": [
          { "sType": "num-html" },
          { "sType": "numeric" },
          null,
          null,
          null,
          null,
          null,
          null,
          { "sType": "currency" },
          null,
          { "bSortable": false }
        ]           
      } );  
    } );
</script>
4

2 回答 2

1

解决方案是将以下行重写
"sDom": "frtiS",为:
"sDom": '<"H"fr>t<"F"iS>',

"H"和表示 jQueryUI的"F"页眉和页脚。

可以在此处找到 sDOM 用法的详细说明:

http://datatables.net/usage/options#sDom

于 2012-12-03T08:51:04.123 回答
0

保存滚动状态的解决方案是将stateSave设置为true。要完成这项工作,还需要使用 dataTables.scroller.js

$(document).ready(function() {
$('#example').DataTable( {
    ajax:           "data/2500.txt",
    deferRender:    true,
    dom:            "frtiS",
    scrollY:        200,
    scrollCollapse: true,
    stateSave:      true
} );

});

检查这个:滚动状态保存

于 2014-12-21T10:49:40.617 回答