Dimas Adi Andrea Dimas Adi Andrea - 5 months ago 28
Javascript Question

How to change url after success in ajax without page reload

This is the ajax



$(".urut").change(function() {
$.ajax({
url: "<?php echo base_url(); ?>categories/brand/<?= $link_brand; ?>?l=<?= $l; ?>&h=<?= $h; ?>&city=<?= $city; ?>&city_name=<?= $city_name; ?>&ket=view",
type: "POST",
data: "urut=" + $(".urut").val(),
success: function(data) {
$("#result").html(data);
}
})
})





This works, but i want the url to change because I have many parameters there and of course with the
data: "urut="+$(".urut").val(),
parameter as well.

Answer

You can now do this in most "modern" browsers!

you can do this to your success action :

window.history.pushState("object or string", "Title", "/new-url");

See this this post to Modify the URL without reloading the page for a basic how-to.

Additional Note:

  1. The first parameter is the data we'll need if the state of the web page changes, for instance whenever someone presses the back or forwards button in their browser. Note that in Firefox this data is limited to 640k characters.
  2. title is the second parameter which can be a string, but at the time of writing, every browser simply ignores it.
  3. This final parameter is the URL we want to appear in the address bar.
Comments