我在网格中使用Jquery DataTables(Datatables.net)。假设我的网格中总共有45个页面,因此当前默认分页为'full_numbers',显示以下按钮:
- 名字,姓氏,1,2,3,4,5,......,45,下一个,姓氏 *
现在,当我单击第5页按钮时,分页以如下方式显示按钮:
- 名字,上一个,1,...,4,5,6,...,45,下一个,最后一个 *
我不想要那些省略号,我想要的是当用户点击第5页时,我想要显示接下来的3页以及1个上一页,如下所示:
- 名字,上一个,4,5,6,7,8,下一个,最后一个 *
因此,最终我希望删除省略号,并以以下格式显示上一页页码、当前页码和下n页页码:
- 第一页、上一页、{上一页}、{当前页}、{后3页}、下一页、最后一页 *
有没有办法在DataTables中实现这一点?
2条答案
按热度按时间jexiocij1#
问题
默认情况下,DataTables 1.10.7的最新版本不具有此功能。
pagination plug-ins提供了附加功能,但遗憾的是,它们都不提供此功能。
溶液
我们创建了分页插件“Full Numbers - No Ellipses”和“Simple Numbers - No Ellipses”来解决这个问题,并显示不带省略号的分页控件。
'pagingType': 'full_numbers'
,但不包括省略号。'pagingType': 'simple_numbers'
,但也不包括省略号。演示
请参阅example of Full Numbers – No Ellipses plug-in以获得演示并下载这两个插件。
如何使用
要使用“简单数字-无省略号”插件:
jquery.dataTables.min.js
之后'pagingType': 'simple_numbers_no_ellipses'
初始化选项。要使用“完整数字-无省略号”插件:
jquery.dataTables.min.js
之后'pagingType': 'full_numbers_no_ellipses'
初始化选项。例如:
js4nwp542#
您可以使用CSS轻松地修复它。
1.在浏览器中右键单击“...”按钮,然后选择“检查”。image description here
1.复制按钮ID。(例如,我的按钮ID是“CallingID_ellipsis”)。image description here
1.添加“显示:没有”在你的“风格”。
呼叫ID_省略号{显示:无!重要;}