How to get query string from JavaScript Object without jQuery?

Question

I'm looking for an dependency-free implementation of jQuery.param(). I'm trying to create a serialized representation of an array or object, suitable for use in a URL query string or Ajax request, without using jQuery.

I searched for some time now, but everyone just seems to use $.param()...

Thank you in advance!

http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values — Felipe Gavilán, Jul 05 '13 at 16:29
perhaps the easiest thing to do would be to look at the code for [`$.param()`/`.serialize()`](https://github.com/jquery/jquery/blob/master/src/serialize.js)... Then you can replace all the jquery specific stuff with your own implementations. — prodigitalson, Jul 05 '13 at 16:32
@CJX: that will just create a JSON string, he wants a URL encoded string. — prodigitalson, Jul 05 '13 at 16:35
var url='index.php?data='+encodeURIComponent(JSON.stringify(...)); — CXJ, Jul 05 '13 at 16:38
@CJX: But that will still give him a JSON string that he needs to decode on the other side, not `property1=value&property2=value2` — prodigitalson, Jul 05 '13 at 16:41
Good point. I guess that's why it's in a comment rather than an answer! Too much multitasking going on at my keyboard, I think. — CXJ, Jul 05 '13 at 16:42

score 1 · Answer 1 · answered Dec 05 '15 at 19:50

I found the best and optimal way on How to get query string values using JavaScript. Checkout the below example to fetch the query string.

var queryString = window.location.search || '';
var keyValPairs = [];
var params      = {};
queryString     = queryString.substr(1);

if (queryString.length)
{
   keyValPairs = queryString.split('&');
   for (pairNum in keyValPairs)
   {
      var key = keyValPairs[pairNum].split('=')[0];
      if (!key.length) continue;
      if (typeof params[key] === 'undefined')
         params[key] = [];
      params[key].push(keyValPairs[pairNum].split('=')[1]);
   }
}

Usage of the above script

//url=http://stackoverflow.com/how-to-get-query-string-values-in-javascript?query=123&list=default
params['query'];
//Output ["123"]

params['list'];
//Output ["default"]

//Note: If the query string value is empty the method will return the value as empty string.

score 0 · Answer 2 · answered Jul 05 '13 at 16:35

if You need to get query string value using javascript

function getUrlVars()
    {
        var vars = [], hash;
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
        for(var i = 0; i < hashes.length; i++)
        {
            hash = hashes[i].split('=');
            vars.push(hash[0]);
            vars[hash[0]] = hash[1];
        }
        return vars;
    }

score 0 · Answer 3 · answered Jul 05 '13 at 16:37

0

If your object is a one dimension array like this:

 var params = { input1:x, input2:y, input3: z };

Then a simple for loop can do the trick to serialize the object

var vals = '';
for(var key in params){
    vals += key + '=' + paramas[key];
}

answered Jul 05 '13 at 16:37

Sam Battat

5,725
1
20
29

score 0 · Answer 4 · answered Jul 06 '13 at 08:41

Create a blank .js file (eg. GetQueryString.js) and copy the following code in it

function getParameterByName(name) {

var match = RegExp('[?&]' + name + '=([^&]*)')
                .exec(window.location.search);

return match && decodeURIComponent(match[1].replace(/\+/g, ' '));

}


var urlParams = {};
(function () {
var e,
    a = /\+/g,
    r = /([^&=]+)=?([^&]*)/g,
    d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
    q = window.location.search.substring(1);

while (e = r.exec(q))
    urlParams[d(e[1])] = d(e[2]);
})();

Include GetQueryString.js file in your code

    <script type="text/javascript" src="~/GetQueryString.js" />

If your key is in URL as follows

http://www.domain.com?key=123

key can be fetched from above URL by following call

var queryStringValue = getParameterByName("key");

How to get query string from JavaScript Object without jQuery?

4 Answers4

Linked