Question

我在JSP文件中创建了表，它显示所有没有过滤的记录和“显示10个条目”计数。我的代码如下所示。

当我搜索其他答案时，解决方法是设置iDisplayLength。但这对我没用。

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

<script src="https://cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/plug-ins/9dcbecd42ad/integration/jqueryui/dataTables.jqueryui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="https://cdn.datatables.net/plug-ins/9dcbecd42ad/integration/jqueryui/dataTables.jqueryui.css">
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<script type="text/javascript">
function searchfiles() {

    $('#fileLoader').DataTable({
        "bProcesing" : true,
        "bServerSide" : true,
        "iDisplayLength" : 10,
        destroy: true,  //reinitializing of the data table
        "aoColumns" : [ {
            "sTitle" : "Rate Files",
            "mData" : "filePath",
        } ],
        "columnDefs": [ {
            "targets": 0,
            "data": "download_link",
            "render": function ( data, type, full, meta ) {
              return '<a href="'+data+'">'+data.split('.pdf')[0]+'</a>';
            }
          } ],
        "fnServerData" : function(sSource, aoData, fnCallback) {
            aoData.push({
                "name" : "hotel",
                "value" : $("#hotel").val()
            });
            aoData.push({
                "name" : "season",
                "value" : $("#season").val()
            });
            aoData.push({
                "name" : "market",
                "value" : $("#market").val()
            });
            aoData.push({
                "name" : "sheetDate",
                "value" : $("#sheet_date").val()
            });
            $.ajax({
                "type" : "POST",
                "url" : "searchfiles",
                "data" : aoData,
                "success" : fnCallback
            });
        },
    });
}
</script>


<table id="fileLoader" width="100%">
        <thead>
            <tr>
                <th>Rate Files</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>

Answer 1

<强>原因

您已使用"bServerSide": true启用了服务器端处理。在这种模式下，搜索，过滤和分页应该在服务器端完成。

很可能您的服务器端脚本（searchfiles）未编程执行此操作，这就是您没有看到订购/过滤/分页工作的原因。

使用bServerSide: false或省略，您仍然可以通过Ajax从服务器获取数据，但搜索/过滤和分页将由客户端的jQuery DataTables执行。

有关处理模式的详细信息，请参阅manual。

<强>解

删除"bServerSide": true以启用客户端处理。

jQuery DataTables - 显示条目菜单和过滤不起作用

1 个答案: