3

I have a url like result?graphType=default&product=xyzzzz&shop=11

I just want to change value of graphType, when user clicks a button. On click of that button i store some value in a variable, and i want to replace graphType=default with graphType=my_new_value in my url without reload. I don't understand how to split url at graphType= . and even if I am able to split to url at graphType, how can I replace default (which can be something else as well depending on user options) with my variable

Farkhat Mikhalko
  • 3,565
  • 3
  • 23
  • 37
Ishita
  • 87
  • 1
  • 2
  • 10
  • Check here http://stackoverflow.com/questions/7171099/how-to-replace-url-parameter-with-javascript-jquery – Hitesh Misro Aug 04 '16 at 06:10
  • You could start with `window.location.search` to return any url parameters... – NewToJS Aug 04 '16 at 06:10
  • `url without reload` : as soon as you change the URL; browser will reload it. Its a part of URL which you are going to change and hence reload. Its not in your hand. – vijayP Aug 04 '16 at 06:15

1 Answers1

6

I think your solution should be like this

$(document).ready(function(){
    var queries = {};
    $.each(document.location.search.substr(1).split('&'), function(c,q){
        var i = q.split('=');
        queries[i[0].toString()] = unescape(i[1].toString()); // change escaped characters in actual format
    });

    // modify your parameter value and reload page using below two lines
    queries['your key']='your value';

    document.location.href="?"+$.param(queries); // it reload page
    //OR
    history.pushState({}, '', "?"+$.param(queries)); // it change url but not reload page
});
Haresh Vidja
  • 8,340
  • 3
  • 25
  • 42
  • 1
    Thanks heaps. Exactly what I was looking for – Ishita Aug 04 '16 at 23:27
  • Glad to hear from you.. dont forget to give up vote and mark as correct.. I strangly like heaps word :D – Haresh Vidja Aug 05 '16 at 04:51
  • please do up vote also, now you have enough repuaions 15+, thanks – Haresh Vidja Aug 10 '16 at 13:49
  • Thanks for ur good answer. just a question. is it possible to make the browser work with the pushed state on history back? when I click the history back button of browser, pushed states don't work... only after a refresh, those are applied to page content. anyways, thanks a lot! – iconique May 31 '20 at 05:05
  • @TaiJinYuan , I think You need to use pop method for history back, hope it will be work. – Haresh Vidja Jun 24 '20 at 12:54