replace URL querystring value on change of dropdown

Question

I have a dropdown which had dual role. User can come to the page(http://mysite/events/Pages/default.aspx) straight and use the dropdown or they can first do a search and the filter the search resuld further by selecting the dropdown. First Case URL will be like http://mysite/events/Pages/default.aspx?hos=Carmel and Second Case URL http://mysite/events/Pages/default.aspx?kwd=health&type=Events&hos=Carmel This is what I am doing right now but it behaves weird and does sth like this to url http://mysite.events/Pages/default.aspx?hos=Crown&hos=Carmel

So if user selected carmel from the dropdown the first time and decided he/she wanted to look for Indianapolis, then it should either replace 'Carmel' with indianapolis or replace the whole querstring "&hos=Carmel" with "&hos=Indianapolis" for the second case and "?hos=Carmel" with "?hos=Indianapolis" for the first scenario

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

                    window.location.href = ( $(this).val() == "All Hospitals" ) ? 'http://mysitesite/events/Pages/default.aspx': location.href +'&hos='+ $(this).val(); }
    )};

I found some nifty code that uses regex to handle the querystring but I don't understand how regex works..How can I use sth like below in my case?

function replaceQueryString(url,param,value) {
    var re = new RegExp("([?|&])" + param + "=.*?(&|$)","i");
    if (url.match(re))
        return url.replace(re,'$1' + param + "=" + value + '$2');
    else
        return url + '&' + param + "=" + value;
}

Answer 1

You need to do something like this:

function replaceQueryString(url,param,value) {
    var re = new RegExp("([?|&])" + param + "=.*?(&|$)","i");
    if (url.match(re))
        return url.replace(re,'$1' + param + "=" + value + '$2');
    else
        return url + '&' + param + "=" + value;
}

$(".hospitalDropDown").change(function(e) {
   window.location.href = replaceQueryString(window.location.href, 'hos', $(this).val());
)};

The replaceQueryString snippet you found was already packaged up in a neat little function for you, so you don't need to know anything about regex to use it. All you need to do is pass that function your url, the parameter you are trying to change ("hos") and the new value.

Also, $(location).attr('href') isn't really valid, and you weren't using it anyway, so just take it out and stick with window.location.href.

Finally, although you didn't need any regex knowledge in this particular case, you could definitely benefit from learning at least some basic regex syntax. Take a look at http://www.regular-expressions.info/ for some good explanations, and then use a regex tester like http://www.regextester.com/ to play around with the samples and to try writing some of your own.