Change URL parameter without refreshing the page

Question

I have been trying to change a parameter of my URL without reloading the site, however, I am not 100% sure what's wrong with my code. What happens in the URL is removing all the parameters and replacing it for a simple string. i.e http://localhost:50754/Signup555

And I want to change from http://localhost:50754/Signup?A=1&B=2&C=3 to http://localhost:50754/Signup?A=1&B=2&C=6

  function changeQueryString(searchString, documentTitle) {
        documentTitle = typeof documentTitle !== 'Pid' ? documentTitle : document.title;
        var urlSplit = (window.location.href).split("?");
        var obj = {
            Title: documentTitle,
            Url: urlSplit[0] + searchString
        };
        history.pushState(obj, obj.Title, obj.Url);
    }

<a onclick="changeQueryString('555', 'Pid')"> change it</a>

Thanks in advance.

Possible duplicate of [How to modify the URL without reloading the page?](https://stackoverflow.com/questions/824349/how-to-modify-the-url-without-reloading-the-page) — Word Rearranger, Jan 16 '19 at 17:44
No, it's using a different method and it includes a HTML button. — Lanshore Dev, Jan 16 '19 at 17:59
window.history.replaceState(null, null, window.location.pathname); — Batsheva Hansav, Jan 16 '19 at 18:09
@RichardSocker what'd be the right correction? Or how would I replace that in my method? — Lanshore Dev, Jan 16 '19 at 18:14
Where do you send the parameters you want to replace in the url? — Batsheva Hansav, Jan 16 '19 at 18:35
For the moment I was coding it like this change it The new value should be 555 — Lanshore Dev, Jan 16 '19 at 18:40

score 0 · Answer 1 · answered Jan 16 '19 at 17:46

0

You can use a "router" library. Navigo is a decent example.

answered Jan 16 '19 at 17:46

dzimney

565
1
5
15

I cannot use this because it's asp.net page. However I appreciate. – Lanshore Dev Jan 16 '19 at 18:01

score 0 · Answer 2 · answered Jan 16 '19 at 18:51

Your function should be:

  function changeQueryString(searchString, documentTitle) {
     window.history.replaceState(null, null, window.location.pathname+"?A="+searchString[0]+"&B="+searchString[1]+"&C="+searchString[2]);
    }

<a onclick="changeQueryString('555', 'Pid')"> change it</a>

Change URL parameter without refreshing the page

2 Answers2