jquery check if URL has a querystring already

Question

If it is the first time site is loading, then when user selects the location dropdown for hospital, it should pass the hos=somelocation as querystring to the URL. http://mysite/events/Pages/default.aspx?hos=Munster

If the URL already has one along with other querystring like http://mysite/events/Pages/default.aspx?kwd=cancer&hos=Munster

then I need to check for if &hos already is in the window.location.search..and if there is one already, then replace whatever value it has with the one recently selected without appending to it like this: http://mysite/events/Pages/default.aspx?kwd=cancer&hos=Munster&hos=Carmel -> which is not what I want. I want this to be http://mysite/events/Pages/default.aspx?kwd=cancer&hos=Carmel once user selects Carmel from the location Dropdown. Someone Please Help!!

$(".LocationDropDown").change(function(e){
    var querystring=window.location.search;
    var currentURL=$(location).attr('href');
    if(querystring=='') {
        window.location.href= ( $(this).val() == "All Hospitals" ) ? 'http://mysitee/events/Pages/default.aspx':'http://mysite/events/Pages/default.aspx?hos='+$(this).val();
        }
        else            
          {
            window.location.href = ( $(this).val() == "All Hospitals" ) ? 'http://mysitee/events/Pages/default.aspx':currentURL+'&hos'+$(this).val();
   }
});

If a plugin is an option for you - this solution may suffice - http://stackoverflow.com/questions/1090948/change-url-parameters-with-jquery — Anthony, Jan 20 '12 at 05:14
JavaScript could use [a good URI object](http://stackoverflow.com/a/7853496/497418)... — zzzzBov, Jan 20 '12 at 05:28

score 0 · Answer 1 · answered Jan 20 '12 at 05:21

Try the BBQ plugin for jQuery. It's really simple to use and the best plugin if you're going to be using multiple querystring values like your example.

To get the variables, you can use:

$.bbq.getState( "kwd" );
$.bbq.getState( "hos" );

and to set the state:

$.bbq.pushState({ hos: Carmel }); //pushState has an optional 2nd param 
//for whether or not to delete all the params not in the push function or to keep them.

and to execute a function on URL change:

$(window).bind( "hashchange", function(e) {
    // In jQuery 1.4, use e.getState( "url" );
    var url = $.bbq.getState( "url" );
});

score 0 · Answer 2 · answered Jan 20 '12 at 05:23

0

this is may be due to the use of currentURL variable in the else part.Use http://mysite/events/Pages/default.aspx?hos='+$(this).val(); instead of currentURL

answered Jan 20 '12 at 05:23

manashb

179
1
1
12

score 0 · Answer 3 · answered Jan 20 '12 at 05:23

I hate just linking out to site, but I found this person's solution and it looks quite good for getting and setting url parameters via javascript.

http://www.west-wind.com/weblog/posts/2009/Sep/07/Get-and-Set-Querystring-Values-in-JavaScript

//check if querystring contains hos
if (getUrlEncodedKey('hos', location.search) != '') {
     //set new value
     setUrlEncodedKey('hos', newval);
}

getUrlEncodedKey = function(key, query) {
    if (!query)
        query = window.location.search;    
    var re = new RegExp("[?|&]" + key + "=(.*?)&");
    var matches = re.exec(query + "&");
    if (!matches || matches.length < 2)
        return "";
    return decodeURIComponent(matches[1].replace("+", " "));
}
setUrlEncodedKey = function(key, value, query) {

    query = query || window.location.search;
    var q = query + "&";
    var re = new RegExp("[?|&]" + key + "=.*?&");
    if (!re.test(q))
        q += key + "=" + encodeURI(value);
    else
        q = q.replace(re, "&" + key + "=" + encodeURIComponent(value) + "&");
    q = q.trimStart("&").trimEnd("&");
    return q[0]=="?" ? q : q = "?" + q;
}

//There are a couple of helpers in use here. For completeness here they are as well:    
String.prototype.trimEnd = function(c) {
    if (c)        
        return this.replace(new RegExp(c.escapeRegExp() + "*$"), '');
    return this.replace(/\s+$/, '');
}
String.prototype.trimStart = function(c) {
    if (c)
        return this.replace(new RegExp("^" + c.escapeRegExp() + "*"), '');
    return this.replace(/^\s+/, '');
}

String.prototype.escapeRegExp = function() {
    return this.replace(/[.*+?^${}()|[\]\/\\]/g, "\\$0");
};

score 0 · Answer 4 · answered Jan 20 '12 at 05:32

Just a hint of code, not tested though.

$(".LocationDropDown").change(function(e){
    var querystring=window.location.search;
    var currentURL=$(location).attr('href');
    if(querystring=='') {
        window.location.href= ( $(this).val() == "All Hospitals" ) ? 'http://mysitee/events/Pages/default.aspx':'http://mysite/events/Pages/default.aspx?hos='+$(this).val();
    }
    else if(str.indexOf("hos=")==-1)
    {
        window.location.href = ( $(this).val() == "All Hospitals" ) ? 'http://mysitee/events/Pages/default.aspx':currentURL+'&hos='+$(this).val();
    }
    else{
        window.location.href= ( $(this).val() == "All Hospitals" ) ? 'http://mysitee/events/Pages/default.aspx': getReplacedValForHospital(currentURL, $(this).val());
    }
});
function getReplacedValForHospital(currentURL, hospitalVal) {
    var tempString = currentURL.substring(currentURL.indexOf("hos="));
    currentURL = currentURL.replace(tempString,"hos="+hospitalVal);
    return currentURL;
}

jquery check if URL has a querystring already

4 Answers4