Access GET variables using jQuery/Javascript

Question

I know that this question has been asked before, but I have had trouble with all of the solutions posted so far. I have a url that looks like this:

http://localhost:3000/virgil/1/render_lesson?toggle=view

It is a Rails call through AJAX, but that should not matter. Everytime I try a function that is supposed to get the variable for "toggle" I get "undefined" instead when I print it to the consoles log. I have tried this function

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;
}

And when I call console.log(getUrlVars()); I get ["http://localhost:3000/"]

But when I call console.log(getUrlVars()["toggle"]); I simply get undefined

I appreciate any help!

EDIT:

Adding the relevant parts of my code. This is a Rails application, that makes the call using AJAX.

<%= link_to 'View Lessons', render_lesson_virgil_path(course, :toggle => :view), :remote => true, :class => 'toggle_lesson', :id => "toggle_lesson#{course.id}" %>

And then in the javascript file that it calls:

function $_GET( name ){
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}

console.log($_GET('toggle')); //This is where it prints the incorrect value to the log, regardless of the function I use.

$("#Course<%= @course.id %>").append('<div id="Lesson<%= @course.id %>" class="render_lesson"></div>');
$("#Lesson<%= @course.id %>").html("<%= escape_javascript(render( :partial => "lesson" )).html_safe  %>");

possible duplicate of [how to get GET and POST variables with JQuery?](http://stackoverflow.com/questions/439463/how-to-get-get-and-post-variables-with-jquery) — Bozho, Apr 03 '12 at 21:34
and http://stackoverflow.com/questions/1403888/get-url-parameter-with-jquery — Bozho, Apr 03 '12 at 21:34
I changed your function to accept a URL string instead of grabbing it from window.location. I pushed in your URL as a string and it worked for me; I got an array that had a "toggle" key and "view" value. — SuperJumbo, Apr 03 '12 at 22:14

score 3 · Answer 1 · answered Apr 03 '12 at 21:34

3

This is the JS function I use for query strings - hopefully it helps you.

function getParameterByName(name) {
var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

answered Apr 03 '12 at 21:34

mikevoermans

3,967
22
27

This appears to have the same issue. When I call `console.log(getParameterByName('toggle'));` I get `null` instead of the proper value. – Rhawb Apr 03 '12 at 21:52

score 0 · Answer 2 · answered Apr 03 '12 at 21:39

Try this (i only changed line 4 - "var hashes ..."):

function getUrlVars()
{
    var vars = [], hash;    
    var hashes = window.location.href.valueOf().split('?').slice(1)[0].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 -2 · Answer 3 · answered Apr 03 '12 at 21:56

-2

I am using it in my 1 of Projects..

function $_GET( name ){
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}

looks like PHP $_GET['']... because i love PHP :D

Usage Example:

URL: index.php?page=newone&id=4&cat=15

Javascript: alert($_GET('page')); // newone

answered Apr 03 '12 at 21:56

Shahrukh

1,486
5
16
20

Its weird when I print that to console.log I get `(an empty string)` – Rhawb Apr 03 '12 at 23:48
@Rhawb: i have tested it again now.. it is working for me.. can you show me your code.. that you are using... – Shahrukh Apr 03 '12 at 23:57
use `console.log($_GET('toggle'));` instead of `console.log(getUrlVars()["toggle"]);`.. And try again.. – Shahrukh Apr 04 '12 at 00:06
I am using that call. You have too look at the end of my original post past my edit, that is the code that I am now using. Sorry if that wasn't clear. – Rhawb Apr 04 '12 at 00:09

Access GET variables using jQuery/Javascript

3 Answers3

Linked