Chrome Back button is not preserving the url history when using Ajax for pagination

Hey guys, pls help me out. i recent used ajax for my laravel pagination. Whenever i click he back button. it does not go back to the page i am coming from. it goes back to page 1. let me Illustrate this clearly. (1) i have a list of items paginated with jquery ajax. (2) when i visit the 5th page( for example) and click an item to view details of that item and decided to click the browser back button, i am expected to be taken back to page 5 where i was. instead, i am taken back to page 1. (3) This is only happening in chrome related browsers. it works well in Firefox;

//BELOW IS MY AJAX CODE;

$(document).ready(function(){

$(document).on('click','.pagination a',function(e){
        e.preventDefault();
       var pageNumber = $(this).attr('href').split('page=')[1];
       getMorePage(pageNumber)
  });

  function getMorePage(page) {
    $.ajax({
        url: "/all-products-ajax/"+"?page="+page,
        type: "get",
        datatype: "html"
    }).done(function (data) {
        $('#product-view').html(data); 
    }).fail(function () {
        alert('Posts could not be loaded.');
    });
}

});