Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Get the values from the "GET" parameters (JavaScript) [duplicate]

I have a URL with some GET parameters as follows:

www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5 

I need to get the whole value of c. I tried to read the URL, but I got only m2. How do I do this using JavaScript?

like image 635
joe Avatar asked Jun 11 '09 08:06

joe


3 Answers

Most implementations I've seen miss out URL-decoding the names and the values.

Here's a general utility function that also does proper URL-decoding:

function getQueryParams(qs) {
    qs = qs.split('+').join(' ');

    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);
like image 37
Ates Goral Avatar answered Oct 05 '22 23:10

Ates Goral


JavaScript itself has nothing built in for handling query string parameters.

Code running in a (modern) browser can use the URL object (a Web API). URL is also implemented by Node.js:

// You can get url_string from window.location.href if you want to work with
// the URL of the current page
var url_string = "http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5"; 
var url = new URL(url_string);
var c = url.searchParams.get("c");
console.log(c);

For older browsers (including Internet Explorer), you can use this polyfill.

You could also use one for URLSearchParams and extract the query string to pass to it with window.location.search.substring(1).


You could also use the code from the original version of this answer that predates URL. The above polyfill is robust and well tested and I strongly recommend it over this though.

You could access location.search, which would give you from the ? character on to the end of the URL or the start of the fragment identifier (#foo), whichever comes first.

Then you can parse it with this:

function parse_query_string(query) {
  var vars = query.split("&");
  var query_string = {};
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    var key = decodeURIComponent(pair.shift());
    var value = decodeURIComponent(pair.join("="));
    // If first entry with this name
    if (typeof query_string[key] === "undefined") {
      query_string[key] = value;
      // If second entry with this name
    } else if (typeof query_string[key] === "string") {
      var arr = [query_string[key], value];
      query_string[key] = arr;
      // If third or later entry with this name
    } else {
      query_string[key].push(value);
    }
  }
  return query_string;
}

var query_string = "a=1&b=3&c=m2-m3-m4-m5";
var parsed_qs = parse_query_string(query_string);
console.log(parsed_qs.c);

You can get the query string from the URL of the current page with:

var query = window.location.search.substring(1);
var qs = parse_query_string(query);
like image 148
Quentin Avatar answered Oct 05 '22 22:10

Quentin


source

function gup( name, url ) {
    if (!url) url = location.href;
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regexS = "[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( url );
    return results == null ? null : results[1];
}
gup('q', 'hxxp://example.com/?q=abc')
like image 37
Haim Evgi Avatar answered Oct 05 '22 23:10

Haim Evgi