Adding Pagination after Ajax call in Joomla

Question

I have a module in joomla 3.4 that creates a jquery price range slider for some products. It uses ajax to load the results however the pagination does not get loaded, so if there are more than 40 results (my pagination limit) then only the first 40 are presented with no way to see the rest without pagination. How can I make it show the pagination if there is one? The pagination must be normal not ajax.

This is the code of the module

<?php
//some code here to calculate $min and $max values of price range
//some code here to add component parameters in the $url variable 

//below the final part of the $url variable, as you can see it has tmpl=component which prevents the pagination from being loaded. If I remove the tmpl=component part then I get an internal server error 500
$url .='&format=raw&ajax=1&tmpl=component';
?>

<script>
jQuery(function() {
    jQuery( "#slider-range" ).slider({
            range: true,
            min: <?php echo $min;?>,
            max: <?php echo $max;?>,
            values: [ <?php echo $min;?>,<?php echo $max;?>  ],
            slide: function( event, ui ) {
                    jQuery( "#slider-text" ).text( "From " + ui.values[ 0 ]    + " to " + ui.values[ 1 ] +' Euro');
            },
            stop: function( event, ui ) {
                    url='<?php echo $url?>'+'&min='+ui.values[ 0   ]+'&max='+ui.values[ 1 ];
                                    jQuery('#com_datafeeds').prepend('<img   style="display: block; margin:auto" src="<?php echo JURI::base(); ?  >/components/com_datafeeds/assets/images/ajax-loader.gif" />');
                    jQuery.get(url, function(data) {
                            if( data) {jQuery('#com_datafeeds').html(  data);
                            } else {
                                    jQuery('#com_datafeeds').html('<h2>No   product found for this price range</h2>');
                            }
                    });
            }
    });
        jQuery( "#amount" ).val( "van " + jQuery( "#slider-range" ).slider( "values", 0 ) +
" tot " + jQuery( "#slider-range" ).slider( "values", 1 ) + ' Euro');
});
</script>
<div style="width:50%;margin:0px auto" id="slider-text"><?php echo "From $min to $max Euro";?></div>
<div style="width:50%;margin:0px auto" id="slider-range"></div>

Answer 1

you can use bootstrap Datatable one of the best solution for pagination searching and display limit just go for it Enjoy !!! https://datatables.net/examples/styling/bootstrap.html