如何在按钮单击时启用和禁用 jquery dataTables 的分页

Posted

技术标签:

【中文标题】如何在按钮单击时启用和禁用 jquery dataTables 的分页【英文标题】:how to enable and disable paging from jquery dataTables on button click 【发布时间】:2015-11-25 10:13:38 【问题描述】:

以下是在数据表网站中找到的用于删除分页的代码。

    $(document).ready(function() 
    $('#example').DataTable( 
        "paging":   false
     );
 );

我的问题是如何在按钮点击时启用和禁用分页

当我将 DataTable 函数 第二次 调用到同一张表时。它显示 错误 数据表已经启动并且我第二次调用它。

【问题讨论】:

只需使用 destroy: truepaging: <new value> 重新创建数据表 - 尽管下面有建议/答案,但缺少一个工作小提琴讲述了它自己的故事。 谢谢,请发布答案,我会接受的。其他答案,要么不工作,要么来自旧图书馆 【参考方案1】:

只需使用 destroy: true 和 paging: 重新创建数据表:

【讨论】:

【参考方案2】:

我只想显示表格的前 10 行,但仍然能够对整个表格进行排序。但我也希望能够单击链接并显示整个表格。

这是我所做的:(我的表是“ka_ad”)

首先,开启分页

table_ad = $('#ka_ad').DataTable(	
	paging: true,
);

第二个(可选:我不想显示数据表分页链接和元素,所以我用 css 隐藏了它们

#ka_ad_lengthdisplay: none;
#ka_ad_paginatedisplay: none;     

最后,切换 bPaginate 设置(我有一个 ID 为“test”的按钮):

$('#test').click( function () 
     //console.log(mytable.settings()[0]['oFeatures']['bPaginate'] ); 
   if(table_ad.settings()[0]['oFeatures']['bPaginate'] == false)
        
              table_ad.settings()[0]['oFeatures']['bPaginate'] = true;
             $('#test').html('Show All Rows');
        
   else
        
              table_ad.settings()[0]['oFeatures']['bPaginate'] = false;
              $('#test').html('Show Fewer Rows');
        
     table_ad.draw(); 
);

【讨论】:

【参考方案3】:

像这样试试。

var oTable;
 $(document).ready(function() 
   oTable =  $('#example').DataTable( 
        "paging":   false
     );

       $('.btn').click( function () 
        oTable.paging= false;
        oTable.fnDraw();
    );

 );

【讨论】:

新库中没有分页方法。 fnDraw 改为 draw()。【参考方案4】:

试试这个:(但我不保证,因为,我还没有测试过)

var oTable = $('#example').dataTable();

// get settings object after table is initialized
var oSettings = oTable.fnSettings();
oSettings.paging = false;

$(".button").click(function()
    oSettings.paging = !oSettings.paging;
);

https://www.datatables.net/forums/discussion/16373/enable-disable-features-after-initializing-the-table

【讨论】:

您展示的示例或功能来自旧 api。最新的数据表提供了settings()函数但是没有分页可用

以上是关于如何在按钮单击时启用和禁用 jquery dataTables 的分页的主要内容,如果未能解决你的问题,请参考以下文章

单击 jquery-tabledit 中的编辑按钮时如何启用选择框?

单击 jquery-tabledit 中的编辑按钮时如何启用下拉选择框?

单击相应复选框时如何启用禁用的锚按钮

如何在按钮单击时在一个视图控制器中正确启用和禁用约束

使用 Jquery 在第一次单击时禁用提交按钮

Jquery - 在按钮单击时启用 editorFor 文本字段