Question

我无法使"pagingType"选项起作用。它是simple，full_numbers，simple_numbers还是full并不重要。它只是坚持预先设定的那个。

设置为：

jQuery 1.11.1
使用Bootstrap 3的DataTables

电话。

$.ajax({
    url: "/getPeople",
    contentType: "application/json",
    processData: false,                 
    complete: function(data){                                                   
        $("#ppl").dataTable({   
            "pagingType": "simple",             
            "aaData": data.responseJSON,                    
            "aoColumns": [                              
                { "sTitle": "Col1", "mDataProp": "col1"},
                { "sTitle": "Col2", "mDataProp": "col2"},
                { "sTitle": "Col3", "mDataProp": "col3"},                               
                { "sTitle": "Col4", "mDataProp": "col4"}
            ],              
            "oLanguage": {
                "sUrl": "/javascripts/i18n/dataTables.Prop.json"
            },                  
            "bFilter": false,
            "bInfo" : false,    
            "bLengthChange": false              
        });
    }
});

这是pagyng div的输出html，因为我们可以看到，当分页类型为1

simple

<div class="col-xs-6">
<div class="dataTables_paginate paging_bootstrap">
    <ul class="pagination">
        <li class="prev disabled">
            <a href="#">← Prev</a>
        </li>
        <li class="active">
            <a href="#">1</a>
        </li>
        <li class="next disabled">
            <a href="#">Next → </a>
        </li>
    </ul>
</div>

你们有没有遇到过这个？感谢。

Answer 1

由于行数仅为4，因此可以容纳在数据表本身的第一页中。但是，您已启用分页功能，这将显示分页功能和选项，即使它不起作用，因为数据表的第二页中没有任何内容。

如果整个内容显示在数据表的第一页中，则必须动态禁用分页。 fnDrawCallback方法将检查DOM中的行数，如果它们超过6，那么分页将是可见的，否则分页将不可见，因为分页div将被隐藏。

  $.ajax({
        url: "/getPeople",
        contentType: "application/json",
        processData: false,                 
        complete: function(data){                                                   
            $("#ppl").dataTable({   
                "pagingType": "simple",             
                "aaData": data.responseJSON,
                "iDisplayLength": 6,  /* fixed number of rows in one page of datatable*/                   
                "aoColumns": [                              
                    { "sTitle": "Col1", "mDataProp": "col1"},
                    { "sTitle": "Col2", "mDataProp": "col2"},
                    { "sTitle": "Col3", "mDataProp": "col3"},                               
                    { "sTitle": "Col4", "mDataProp": "col4"}
                ],              
                "oLanguage": {
                    "sUrl": "/javascripts/i18n/dataTables.Prop.json"
                },                  
                "bFilter": false,
        "fnDrawCallback": function (row, data, index) {
                        if ($("#ppl").find("tr").length > row.aoData.length)
                        {
                            $("#ppl").find('.dataTables_paginate')[0].style.display = "none";
                            $("#ppl").find('.dataTables_info')[0].style.display = "none";
                        } else {
                            $("#ppl").find('.dataTables_paginate')[0].style.display = "block";
                            $("#ppl").find('.dataTables_info')[0].style.display = "block";
                        }
                    }

            });
        }
    });

DataTables pagingType无法正常工作

1 个答案: