Change url to ajax request

Question

I want to add some GET parameters to the page url. I load the content as follows:

 $("#content").load("shop.pl #content .product", $.param({categ:1)})); 

How can I change the url to have the same parameter ?categ=1 ?

Answer 1

To achieve this, you can use the HTML5 pushState API . However, only the latest browsers support it, and IE does not yet support it in IE9. There was no way to do this before. However, there is an agreement that you should use location.hash to specify a page whose state was changed using an ajax request. For more information on how to use URL hashes to indicate the state of your page, you can take a look.

There is a History.js library that can be used to migrate to pushState. Its API is very close to the PushState API, but it will transparently provide a hash break if the browser does not support pushState.

Answer 2

Your content is uploaded via AJAX, so maybe the URL should have a modified hash snippet - see http://code.google.com/web/ajaxcrawling/docs/specification.html

Answer 3

You can try to manipulate the visible URL using the pushState() method (see the documentation , you can also read about the onpopstate event ).

This way you can change the URL the way you want.

Some demo of how to change the URL without reloading the page is here: http://html5demos.com/history