Update pagination after ajax call

What is the in-function version? Thanks Also paste it in the main function or as seperate code in the search click

the bit you copied. You dont need to re-declare the function in the local scope, because it’s (now) already in the global scope. So remove it from where you copied it.

I am getting error saying $pager1 is undefined. I have posted the code I have used. Have i got it right. Thanks

$(function() {
  $('table.paginated').each(function() {
    var currentPage = 0;
    var numPerPage = 8;
    var $table = $(this);
    var numRows = $table.find('tbody tr').length;
    var numPages = Math.ceil(numRows / numPerPage);
    var $pager1 = $('<div class="pager"></div>');
    var $pager2 = "";
    var $numberPicker = $('<div class="numberPicker"></div>');
    var dropdown = $('<select class="options"></select>');
    var dropdown2 = "";
    $table.bind('repaginate', function() {
      $table.find('tbody tr').hide().slice(currentPage * numPerPage, (currentPage + 1) * numPerPage).show();
     //Start copying here.
    //Stop copying here.
    $([5, numPerPage, 10, 20]).each(function() {
      var $num = this;
      $('<option></option>').text(this).attr('value', this).appendTo(dropdown);
    dropdown.bind('change', function() {
      var oldNumPerPage = numPerPage;
      numPerPage = this.value;
      numPages = Math.ceil(numRows / numPerPage);
      currentPage = Math.ceil((currentPage * oldNumPerPage) / numPerPage);
      $("span.page-number:eq(" + currentPage + ")").trigger('click');
    dropdown2 = dropdown.clone(true);
function rePage(numPages) {
      for (var page = 0; page < numPages; page++) {
        $('<span class="page-number"></span>').text(page + 1).bind('click', {
          newPage: page
        }, function(event) {
          var selected = $(this).index();
          var selected2 = ($(this).index()) + numPages;
          currentPage = event.data['newPage'];
          $("span.page-number").each(function(index) {
            if (index === selected) {
              $("span.page-number:eq(" + selected2 + ")").addClass('active')
      $pager2 = $pager1.clone(true);

Gotta pop out for a while. i’ll check back with you later. Thanks for all your help.

I should have actually checked and it just clicked into my head… the intention of this is to have no more than 1 such paginated table on the page at any given time, correct?

Not sure what you mean. At the moment the default amount of records to display is 8 which creates 6 pages of pagination because there are 48 records. After a search however, if there are say 20 results, this will create 3 pages and so on.

At the moment, when I perform a search, on the success call, i empty the table and populate with the results from php. So i guess, yes there will only be 1 paginated table on the page at any given time. The default or the search results. Cheers

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.