无法使用固定列

时间:2015-10-08 07:43:14

标签: jquery datatables

我正在使用数据表来显示使用ajax的表。当我修复第一列时,它无法进行搜索/过滤?我的代码如下:

      var quotetable = $('#quotelog-table').DataTable(
    {
    "ajax": {"url": "functions/ajax-getquotelog.php", "type": "POST"},
            "deferRender": true,
            fixedHeader: true,
            fixedColumns: {
            leftColumns: 1
            },
            scrollX: true,
            scrollY: "560px",
            colReorder: true,
            select: {
            style: 'single'
            },
            "language": {
            "lengthMenu": "Showing _MENU_ records per page",
                    "zeroRecords": "Nothing found - sorry",
                    "info": "Showing page _PAGE_ of _PAGES_ of _MAX_ items",
                    "infoEmpty": "No records available",
                    "infoFiltered": "(filtered from _MAX_ total records)"
            },
            "lengthMenu": [[20, 25, 50, 100, - 1], [20, 25, 50, 100, "All"]]

        }); // end of datatable.

 // Apply the search
    quotetable.columns().every( function () {
        var that = this;

    $( 'input', this.footer() ).on( 'keyup change', function () {

        if ( that.search() !== this.value ) {
            that
                .search( this.value )
                .draw();
        }
    } );
} );

页面呈现正确 - 我可以查看所有字段并排序除第一个以外的所有字段(已修复?)如果我从代码中删除fixedColumns它可以正常工作。这是一个错误还是有人知道解决方法?

3 个答案:

答案 0 :(得分:0)

我找到了解决方案。

数据表中出现了fixedColumns条目:

fixedColumns: {
                leftColumns: 1
                },

正在为该列生成重复的文本输入框。 (class .DTFC_LeftFootWrapper)预先渲染其他输入框。

通过将以下内容添加到我的CSS中,不会显示不需要的文本框。

.DTFC_LeftFootWrapper {
    display:none;
}

感谢您的帮助

答案 1 :(得分:0)

<Script>

$(document).ready(function() {
    var dt = $('#sample').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "serverRequest/manage_login.php",
        "columns": [
        null,null,null,
{ "searchable": false },null,{ "searchable": false },{ "searchable": false },null,{ "searchable": false },{ "searchable": false }
        ]

    });

});

</script>

答案 2 :(得分:0)

如果您的问题与Bootstrap数据表有关,请参阅文档here中的示例。