CODEWITHSUNDEEP
javascriptjqueryajaxjsonpagination
Steven
Steven

Reputation: 1

Pagination using Ajax with JSON

I am trying to use a plugin that I downloaded to put my callback into the pagination plugin.

I have the callback in the correct place however the pageselectCallback function is not initialized where it copies a first page record an puts it into a div.

     // This demo shows how to paginate elements that were loaded via AJAX
  // It's very similar to the static demo.

/**
* Callback function that displays the content.
*
* Gets called every time the user clicks on a pagination link.
*
* @param {int}page_index New Page index
* @param {jQuery} jq the container with the pagination links as a jQuery object
*/
function pageselectCallback(page_index, jq){
    var new_content = $('#hiddenresult div.result:eq('+page_index+')').clone();
    $('#Searchresult').empty().append(new_content);
    return false;
   }

    /** 
   * Callback function for the AJAX content loader.
    */
    function initPagination() {
    $('#answer').text('This is a call to see that it is initiated');
    var num_entries = $('#hiddenresult div.result').length;
    // Create pagination element
    $("#Pagination").pagination(num_entries, {
    num_edge_entries: 2,
    num_display_entries: 8,
    callback: pageselectCallback,
    items_per_page:1
    });
}

// Load HTML snippet with AJAX and insert it into the Hiddenresult element
// When the HTML has loaded, call initPagination to paginate the elements        
$(document).ready(function() {
   $.ajax({ 
        url: "https://api.eancdn.com/ean-services/rs/hotel/v3/list?cid=55505&minorRev=99&apiKey=cbrzfta369qwyrm9t5b8y8kf&locale=en_AU&city=Brisbane&stateProvinceCode=QL&countryCode=AU&&numberOfResults=10&_type=json",
       dataType: "jsonp",
        success: function(data) {
        var StrHotelListResponse = data.HotelListResponse.HotelList.HotelSummary;
            $.each(StrHotelListResponse, function(index, value) {
            var StrlowRate = parseInt(value.lowRate);
               $('#hiddenresult').append('<div class="hotel-name">' + value.name + '</div>');
               $('#hiddenresult').append('<div class="hotel-rating">' + value.hotelRating + '</div>');
               $('#hiddenresult').append('<div class="hotel-address">' + value.address1 + ' ' + value.city + ', ' + value.stateProvinceCode + ' ' + value.postalCode  + '</div>');
        });

              initPagination();
          },
       error: function(e) {
           console.log(e.message);
           //alert('no');
       }
   });
   });

Upvotes: 0

Views: 2902

Answers (1)

Jamie Hutber
Jamie Hutber

Reputation: 28064

By doing $(initPagination); you are not calling the function. You are wrapping it in the jQuery function.

You'll want to call it like any other function:

 initPagination();

Upvotes: 1

Related Questions