Change the get parameters in the address bar in jquery

Question

when you search on yelp, by adding additional search parameters the page does not reload. I think the results are changed based on ajax, however when you click on one of the restaruants and go back to the previous page. All of the parameters are still there. I noticed the address bars change as the parameters change. I found http://www.asual.com/jquery/address/ but it seems to add # at the end of the url. Is there a way to make it simply like index.php?xyz=1 without refreshing the page

Answer 1

It is impossible to change the URL (anything before a hash tag) with jquery for security reasons. If you look closely, they are actually using a hash tag:

http://www.yelp.com/search?find_desc=food&ns=1&find_loc=85022#find_desc=food

Answer 2

yelp does the same: i reproduced the navigation you mentioned and here is the resulting url when going back to the search page:

http://www.yelp.com/search?find_desc=love&ns=1&find_loc=San+Francisco%2C+CA#places=CA%3ASan_Francisco%3A%3ACivic_Center%2FTenderloin

As you can see, there is a hash.

Answer 3

The #(hash) key is the trick used by many people to build single web page apps(that do not reload).

The # comes from the bookmark on anchors <a href="#chapter1">Chapter 1</a>.
If you click that link, it will scroll to a text in the page that is just preceeded by a <a name="chapter1"></a>.

And when the user clicks on the Chapter 1 link, the url will become page.html#chapter1 and the page do not reload even if the text in the address bar has changed.

And that's the end of the fun part.

Now if you want to use the # key, you need either to build your own functions to handle it or use some libraries like the Really Simple History that will help you manage all the cross browser issues, when the user click back or next, etc...

Answer 4

i'm not sure if i'm in the right place but what do these mean in the address bar: %2C %5F

Any idea?