本文介绍了如何清除Jquery DataTable中的省略号分页?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

限时删除!!

我正在使用Jquery DataTables(Datatables.net)与我的网格。假设我的网格共有45页,所以目前的默认分页是full_numbers,显示以下按钮:



首先, 4,5,...,45,Next,Last



现在,当我点击第5页按钮时,分页以这种方式显示按钮:



首先,上一个,1,...,4,5,6,...,45,Next,Last



我不想要那些省略号,我想要的是当用户点击第5页时,我想显示接下来的3页以及前一页如下:



首先,上一个,4,5,6,7,8,下一个,最后



所以最终我要删除椭圆,并显示以前格式的页面编号,当前页码和下一页数:



首先,上一页{{上一页},{当前页面},{next 3 pages},Next,Last



有没有办法在DataTables中实现?

解决方案

最新版本的DataTables 1.10.7默认情况下不具备此功能。



用于演示和下载两个插件。

使用简单数字 - 无椭圆插件:




  • 下载

  • 包含在 jquery.dataTables.min.js

  • 使用'pagingType':'simple_numbers_no_ellipses'初始化选项。



要使用全数字 - 无椭圆插件:




  • 下载

  • 包含在 jquery.dataTables.min.js

  • 使用'pagingType':'full_numbers_no_ellipses'初始化选项。



例如:

 < script type =text / javascriptsrc =// code.jquery。 com / jquery-1.11.1.min.js>< / script> 
< script type =text / javascriptsrc =// cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js\"></script>
< link rel =stylesheettype =text / csshref =// cdn.datatables.net/1.10.7/css/jquery.dataTables.css\">

< script type =text / javascriptsrc =full_numbers_no_ellipses.js>< / script>

< script type =text / javascript>
$(document).ready(function(){
$('#example')。DataTable({
'pagingType':'full_numbers_no_ellipses'
});
});
< / script>


I am using Jquery DataTables(Datatables.net) with my grid. Suppose I have 45 pages in my grid in total hence currently default pagination with 'full_numbers' showing following buttons:

First,Last,1,2,3,4,5,...,45,Next,Last

Now when I click on 5th page button, pagination shows buttons this way:

First,Previous,1,...,4,5,6,...,45,Next,Last

I don't want those ellipses, what I want is when user clicks on 5th page, I want to show next 3 pages along with 1 previous page like this:

First,Previous,4,5,6,7,8,Next,Last

So ultimately I want to remove ellipses and show previous page number, current page number and next n page numbers in this format:

First,Previous,{previous page},{current page},{next 3 pages},Next,Last

Is there any way to make it possible in DataTables?

解决方案

Latest version of DataTables 1.10.7 does not have this ability by default.

There are pagination plug-ins that provide additional functionality, but unfortunately none of them provide this functionality.

We have created pagination plug-ins "Full Numbers – No Ellipses" and "Simple Numbers – No Ellipses" to overcome this problem and display pagination control without ellipses.

  • "Full Numbers – No Ellipses" plug-in behaves similarly to pagination option 'pagingType': 'full_numbers' but excludes ellipses.

  • "Simple Numbers – No Ellipses" plug-in behaves similarly to pagination option 'pagingType': 'simple_numbers' but excludes ellipses also.

See example of Full Numbers – No Ellipses plug-in for demonstration and to download both plug-ins.

To use "Simple Numbers – No Ellipses" plug-in:

  • download simple_numbers_no_ellipses.js
  • include it after jquery.dataTables.min.js
  • use 'pagingType': 'simple_numbers_no_ellipses' initialization option.

To use "Full Numbers – No Ellipses" plug-in:

  • download full_numbers_no_ellipses.js
  • include it after jquery.dataTables.min.js
  • use 'pagingType': 'full_numbers_no_ellipses' initialization option.

For example:

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.css">

<script type="text/javascript" src="full_numbers_no_ellipses.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
        $('#example').DataTable( {
            'pagingType': 'full_numbers_no_ellipses'
        } );
    } );
</script>

这篇关于如何清除Jquery DataTable中的省略号分页?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

1403页,肝出来的..

09-08 19:03