【问题标题】:In datatable more than 10 records show pagination otherwise not display pagination using datatables在数据表中,超过 10 条记录显示分页,否则不使用数据表显示分页
【发布时间】:2015-11-02 13:21:37
【问题描述】:

在我的网站中,我使用数据表来显示数据。现在的问题是如果有 10 条记录而不是默认分页显示,但是当有超过 10 条记录时,应该显示数据表的分页。

这就是我初始化数据表的方式

$(document).ready(function(){
        $('#tbl_member').dataTable({
            "iDisplayLength": 10,
            "bAutoWidth": false,
            "aoColumnDefs": [
                {"bSortable": true, "aTargets": [0,2]}
            ]
        });
});

这个数据表代码是我完成服务器端处理时的:-

var save_method; 
var table;
    $(document).ready(function() {
      table = $('#table').DataTable({ 
        oLanguage: {
        sProcessing: "<img src='<?php echo base_url();?>assets/img/loader.gif'>"
        },
        "processing": true, 
        "serverSide": true,     
        // Load data for the table's content from an Ajax source
        "ajax": {
            "url": "<?php echo base_url();?>Technology/technology_list",
            "type": "POST"
        },

       "columnDefs": [
        { 
          "targets": [ -1 ], 
          "orderable": false, 
        },
        ],
      });
    });

【问题讨论】:

  • 如何初始化数据表? Ny 标记,通过 AJAX,通过 JSON ...?请显示一些代码....
  • 我还在数据表中完成了服务器端处理。为此,我粘贴了一些数据表代码。如果我申请下面的答案它不起作用
  • 这正是我问的原因:) 不同的情况有不同的方法。那么,Technology/technology_list 会返回一个 JSON 吗?如果我知道更多,我会很乐意创建一个示例:侦听xhr 事件,如果记录#table_filter 和#table_length,我很想生成一个示例,但需要知道AJAX 响应是如何形成的。
  • 是的 Technology/technology_list 将返回 JSON。我粘贴 technology_list 方法代码。
  • 但是我如何解决这个数据表代码中超过 10 条记录的问题

标签: datatables


【解决方案1】:

使用bPaginate(旧的匈牙利符号样式)或paginate 打开或关闭分页。您可以使用表达式来确定选项:

$('#tbl_member').dataTable({
   "bPaginate" : $('#tbl_member tbody tr').length>10,
   "iDisplayLength": 10,
   "bAutoWidth": false,
   "aoColumnDefs": [
       {"bSortable": true, "aTargets": [0,2]}
   ]
});

这适用于 1.9.x 和 1.10.x 版本的数据表。演示显示两张表,一张少于 10 条记录,另一张多得多 -> http://jsfiddle.net/t2xcfLap/3/


在 AJAX 更新后隐藏分页控件。假设 JSON 响应在表单上

{
  "draw": 1,
  "recordsTotal": 3,
  "recordsFiltered": 3,
  "data": [
    [...],
  ]
}

然后

table.on('xhr', function(e, settings, json, xhr) {
    if (json.recordsTotal<10) {
        $("#example_paginate").hide();
        $("#example_length").hide();
    } else {
        $("#example_paginate").show();
        $("#example_length").show();
    }        
})

演示 -> http://jsfiddle.net/yyo5231z/

注入的控件以&lt;tableId&gt;_length&lt;tableId&gt;_paginate 的形式命名。所以如果你的表有idtable,那么上面应该是$("#table_paginate").hide();等等。

与使用静态表的第一个答案相比,采用不同方法的原因是,如果不重新初始化表,就无法动态更改分页。

【讨论】:

    猜你喜欢
    • 2021-02-17
    • 1970-01-01
    • 2018-08-11
    • 2015-05-29
    • 1970-01-01
    • 1970-01-01
    • 2019-09-02
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多