jQuery TableSorter插件

时间:2011-07-25 09:31:24

标签: jquery-plugins tablesorter

是否可以禁用jQuery的tablesorterpager插件中的分页(First,Previous,Next,last)链接。这是我在jQuery中的代码

 jQuery('#mentor_engagement_report_table')
   .tablesorter({ debug: false, sortList: [[0, 0]], widgets: ['zebra'] })
   .tablesorterPager({container: jQuery("#pager"), positionFixed: false,size:10});

4 个答案:

答案 0 :(得分:1)

我在github上创建了一个tablesorter插件的分支。在阅读了这个问题之后,我为名为updateArrows的寻呼机插件添加了一个新选项,当true它应用了一个类名,包含在箭头的新cssDisabled选项中。这是初始化代码和demo

$("table")
  // initialize tablesorter
  .tablesorter()

  // initialize the pager plugin
  .tablesorterPager({
    // target the pager markup
    container: $("#pager"),
    // disabled class name to use
    cssDisabled : 'disabled',
    // apply disabled class name to the pager arrows when the rows at either extreme is visible
    updateArrows: true
  });

以下是演示中使用的css的一些示例:

/*** css used when "updateArrows" option is true ***/
/* the pager itself gets a disabled class when the number of rows is less than the size */
#pager.disabled {
  display: none;
}
/* hide or fade out pager arrows when the first or last row is visible */
#pager img.disabled {
  /* visibility: hidden */
  opacity: 0.5;
  filter: alpha(opacity=50);
}

答案 1 :(得分:0)

如果您使用Pager Plugin,则只有分页,如果没有,则不会有寻呼机部分......

如果您只想隐藏寻呼机

在您的javascript代码添加后

$(".pager").hide();

您的问题应该是,为什么我想要寻呼机区域?如果我只想显示10行,那么数据应该只包含10行......

答案 2 :(得分:0)

如果您发布了整个代码并且更清楚自己想要的内容会更容易。

你还想选择每页的行数吗? 然后试一试:http://jsfiddle.net/q66TA/

如果您不想要寻呼机的任何内容,请不要使用它..

<强>更新 如果您需要当前页码和总页数,则需要将此功能添加到插件中。有一个回调插件/补丁可用于此: http://www.vinertech.com/patches/tblsorter.pager.cbk.patch

更多相关信息:http://daveviner.blogspot.com/2009/12/jquery-tables-and-administrative.html

答案 3 :(得分:0)

最好的方法,以及我们在所有需要查看全部按钮的内容上使用的是使用插件本身禁用它的方式。

这是直接来自他们的网站http://mottie.github.io/tablesorter/docs/example-pager.html

实际使用的代码实际上非常简单:

// Disable / Enable
    // **************
    $('.toggle').click(function(){
      var mode = /Disable/.test( $(this).text() );
      $('table').trigger( (mode ? 'disable' : 'enable') + '.pager');
      $(this).text( (mode ? 'Enable' : 'Disable') + ' Pager');
      return false;
    });
    $('table').bind('pagerChange', function(){
      // pager automatically enables when table is sorted.
      $('.toggle').text('Disable Pager');
    });

<button type="button" class="toggle">Disable Pager</button>