i am trying to stop my 'load more' button from displaying once there is no more results to show.
So, my plan was that once the load more button was clicked and the query ran on the database, i would do a rowcount and then if that number was less than what was requested in the LIMIT claus then i would return that information.
So currently my js script looks like this:
$(document).ready(function(){
var pageIndex = 1;
$('#loadmorebuilds-div').click(function() {
$('#buildcontainer').imagesLoaded( function(){
$.ajax({
url: 'includes/loadmorebuilds.php?type=follow&pageIndex=' + pageIndex,
success: function(html) {
var el = jQuery(html);
jQuery("#buildcontainer").append(el).masonry( 'reload' );
$("#loadmorebuilds-div").stop();
pageIndex++;
$("#buildcontainer").masonry()
}
});
});
});
});
This works fine, but i wanted to put a JSON return in my loadmorebuilds.php page.
So the plan was to do e.g.
// check if the results count is less than requested
if ($checkforlast < 8) {
$return['noMore'] = true;
echo json_encode($return);
}
I would then change my js to look like so:
$(document).ready(function(){
var pageIndex = 1;
$('#loadmorebuilds-div').click(function() {
$('#buildcontainer').imagesLoaded( function(){
$.ajax({
url: 'includes/loadmorebuilds.php?type=follow&pageIndex=' + pageIndex,
success: function(html) {
var el = jQuery(html);
jQuery("#buildcontainer").append(el).masonry( 'reload' );
$("#loadmorebuilds-div").stop().fadeOut();
pageIndex++;
$("#buildcontainer").masonry()
if (response.correctKey === true) {
DO SOMETHING TO REMOVE BUTTON
}
}
});
});
});
});
The problem comes when i change the content type:
header('Content-Type: application/json');
Because thats changing how the data i send back is (i think?). Changing the content type results in no new content being shown and nothing happens on the load more button being clicked.
is there another way to send the databack to the ajax call if there is less results than requested and without changing the content type?
Hope this makes sense!