Change querystring without reloading/refreshing

Question

I want to change my url on click without refreshing page. For example my URL is http://test.com?search=test

When I click any filter value on the search page like "category" then my URL should be:

http://test.com?search=test$category=cat1

When I click on another category it should be:

http://test.com?search=test&category=cat1,cat2

When I click a brand then the URL should be:

http://test.com?search=test$category=cat1,cat2&brand=br1

When I deselect a category then the URL should be:

http://test.com?search=test$category=cat2&brand=br1

Please help me.

I have the same problem. Read [this](http://stackoverflow.com/questions/3338642/updating-address-bar-with-new-url-without-hash-or-reloading-the-page). — jmtb, Mar 03 '16 at 08:04

score 1 · Answer 1 · edited May 23 '17 at 12:09

1

You can change it via the history api

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

In this case the relative /new-url will be set with the new title. You can experiment with it in the console. If you input this on stackoverflow.com the url will magically change to https://stackoverflow.com/new-url

edited May 23 '17 at 12:09

Community

1
1

answered Mar 03 '16 at 08:02

Kordi

2,405
1
14
13

1

This is not true. You can: HTML5 History API. – Ram Mar 03 '16 at 08:03
@Vohuman absolutely right! – Kordi Mar 03 '16 at 08:04
I think in angular, for activating the HIstory API one should use the `$locationProvider` service and it's `.html5Mode(true)` method. – Ram Mar 03 '16 at 08:07

Change querystring without reloading/refreshing

1 Answers1