here is my code for filter and pagination in script tag here i successfully applied filters and pagination through ajax and jquery but question is that
in pagination : In my website there was 100 product (10 product each page) ,so when i was on page 4 and click on product description and when i come back , i automatically revert to first page.
in filter: when i click filter and click on product description and when i come back it removed all filters
**i check on internet there were some solution regation pushState() or replaceState() , Please help me with this **
function filter_data(page)
{
$('.filter_data').html('<div id="loading" style="" ></div>');
var action = 'fetch_data';
var minimum_price = $('#hidden_minimum_price').val();
var maximum_price = $('#hidden_maximum_price').val();
var brand = get_filter('brand');
var ram = get_filter('ram');
var storage = get_filter('storage');
$.ajax({
url:"fetch_data.php",
method:"POST",
data:{action:action, minimum_price:minimum_price, maximum_price:maximum_price,page:page,brand:brand, ram:ram, storage:storage},
success:function(data){
$('.filter_data').html(data);
}
});
}
function get_filter(class_name)
{
var filter = [];
$('.'+class_name+':checked').each(function(){
filter.push($(this).val());
});
return filter;
}
$('.common_selector').click(function(){
filter_data();
});
$('#price_range').slider({
range:true,
min:1990,
max:2022,
values:[1990, 2022],
step:1,
stop:function(event, ui)
{
$('#price_show').html(ui.values[0] + ' - ' + ui.values[1]);
$('#hidden_minimum_price').val(ui.values[0]);
$('#hidden_maximum_price').val(ui.values[1]);
filter_data();
}
});
$(document).on('click', '.pagination_link', function(){
$('html, body').animate({
scrollTop: $("#withref").offset().top
}, 1000);
var page = $(this).attr("id");
filter_data(page);
});
});
so it is ajax code for filter and pagination please help me with this how i can apply pushstate or replace state so that when i go back ajax filters cannot be removed