Deal with query strings in JS, like http_build_query, etc

Question

Here's what I have

if(condition1) {
     location.href = location.href+'/?site_type=normal';
}
else if(condition2) {
    location.href = location.href+'/?site_type=other';
}

Of course, if the location.href already has query vars on it, thats a problem, etc.

I need to

Find the vars from the query string
if site_type already exists, replace the value with either 'normal' or 'other'
rebuild the url with the new site_type

edit: I found I needed to account for all kinds of URLs:

domain.com
domain.com/path/to/sth/
domain.com/?site_type=normal
domain.com?var=123&foo=987
domain.com/path/?site_type=normal&var=123&foo=987

So, here's what I came up with, suggestions welcome:

var searchstring = window.location.search;
var url = window.location.href;

console.log('search: ' +  searchstring);
console.log( 'url: ' +  url);
// strip search from url
url = url.replace(searchstring,"");
console.log( 'url: ' +  url);
//strip site_type from search
searchstring = searchstring.replace("&site_type=normal","")
                        .replace("&site_type=other","")
                        .replace("?site_type=normal","")
                        .replace("?site_type=other","")
                        .replace("?","")
                        ;
console.log('search: ' +  searchstring);
if(searchstring != ''){searchstring = '&' + searchstring;}
var final = url + '?site_type=normal' + searchstring;
final = final.replace("&&","&");
console.log('final: ' +  final);

Related (consider duplicate keys): http://stackoverflow.com/questions/486896/adding-a-parameter-to-the-url-with-javascript — John Carter, Jan 09 '13 at 01:32

ericponto · Accepted Answer · 2013-01-09T03:50:07.460

2

You can directly access the query string with window.location.search. You can convert it to an object using this regex trick found here.

var queryString = {};
window.location.search.replace(/([^?=&]+)(=([^&]*))?/g, function($0, $1, $2, $3) {
  queryString[$1] = $3; }
);

Then set the site_type on queryString appropriately.

queryString["site_type"] = "normal";

And finally, convert it back into a string and set that as the window.location.search.

var searchString = "";
for ( q in queryString ) {
  searchString+="&" + q + "=" + queryString[q];
}
window.location.search = searchString;

edited Jan 09 '13 at 03:50

answered Jan 09 '13 at 01:26

ericponto

736
4
8

Of course you could check `(window.location.search === "")` if you cared about the extra `&`. – John Carter Jan 09 '13 at 01:29
I edited my answer with a solution that hopefully addresses everything now. – ericponto Jan 09 '13 at 03:50
Great! It looks like js automajically strips off the preceding '&' from the searchString before it appends it to the window.location? Is there a way to get "window.location.search = searchString" into a variable so I can console.log it? Thats just for me to understand it, it seems to be working with any kind of url i throw at it. – Doug Cassidy Jan 09 '13 at 06:26

score 0 · Answer 2 · answered Jan 09 '13 at 01:24

Here's a way to do this:

//remove existing param and append new one..
var newHref = window.location.href.replace(window.location.search,"") + '?site_type=other';

//change href
window.location.href = newHref;

works only if you have one parameter that you want to replace, otherwise it would remove all parameters.

Alfarem · Answer 3 · 2013-01-09T01:37:22.417

for example if you have

yourpage.com/?site_type=normal

and you need only website not query vars you cans clear them

var novars= location.href.replace(window.location.search,"")

this case novars = youroage.com

for just getting variables u can do this:

var site_type = window.location.search.replace("?site_type=","");

here i will get site_type value whether its normal or other

this case your variable site_type = "normal"

for rebuilding url u can just add new site_type

location.href = novars+"?site_type=normal"

or

location.href = novars+"?site_type=other"

Deal with query strings in JS, like http_build_query, etc

3 Answers3