Handling QueryString Using jQuery

Introduction

This article will help to handle QueryString values using jQuery.

Background

I was unable to handle designs (select particular options) according to querystring values when the page got refreshed. So I used jQuery to handle these querystring values. After page gets refreshed, Jquery code will execute and help to handle querystring variables easily.

Using the Code

In normal back-end code when page gets refreshed, the default values will be reset to variable. So in my initial code, Jquery worked for default variable. Later, I came across the below code to handle QueryString variable such that after Page get refreshed, Jquery code will be executed and get new querystring values.

Hence jQuery worked for new QueryString values.

<script type="text/javascript" language="javascript">
    $(document).ready(function()
    {
        var urlParams = {};
        (function () 
        {
            var match,
            pl= /\+/g,  // Regex for replacing addition symbol with a space
            search = /([^&=]+)=?([^&]*)/g,
            decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
            query  = window.location.search.substring(1);

            while (match = search.exec(query))
            urlParams[decode(match[1])] = decode(match[2]);
        })();
         if( urlParams["q1"]=== 1 )
        { return 1; }
}); </script>

Here... urlParams["q1"], qurlParams["q2"], urlParams["q3"] are the values of querystring variables q1, q2, q3 respectively.

Points of Interest

Front end design becomes easy to handle.