Solved

Get QueryString

Posted on 2001-08-17
23
7,628 Views
Last Modified: 2011-08-18
How do I use JavaScript to get QueryString ?
0
Comment
Question by:weiyee08
  • 9
  • 7
  • 6
  • +1
23 Comments
 
LVL 14

Expert Comment

by:avner
ID: 6398130
<script>
alert(self.location.search)
</script>
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6398137
queryString = window.location.href.substring(window.location.href.indexOf('?') + 1);


:o)

Ant
0
 
LVL 14

Expert Comment

by:avner
ID: 6398145
Ant , why parse it when you can use the location Object propertie ?
0
Ransomware-A Revenue Bonanza for Service Providers

Ransomware – malware that gets on your customers’ computers, encrypts their data, and extorts a hefty ransom for the decryption keys – is a surging new threat.  The purpose of this eBook is to educate the reader about ransomware attacks.

 
LVL 1

Expert Comment

by:gordonmcmullan
ID: 6398149
Hi,

The query string is held in the browsers location object.

The search property of the location object stores the query string, this is a read/write string property so you can both get and set the query string.

access it like this

somestring = location.search;

hope this helps

Gordon McMullan

0
 
LVL 14

Expert Comment

by:avner
ID: 6398153
gordonmcmullan ,
Welcome to EE.
Please read :
http://www.experts-exchange.com/jsp/qShow.jsp?qid=20170202#tip

0
 

Author Comment

by:weiyee08
ID: 6398157
but how do I separate the fields ?
0
 

Author Comment

by:weiyee08
ID: 6398165
a.marsh's answered is much better
0
 
LVL 14

Expert Comment

by:avner
ID: 6398172
Try this :

query=self.location.search;
valuesArr=query.split("&");
0
 
LVL 14

Expert Comment

by:avner
ID: 6398173
valuesArr will now hold an Array() of the name value pairs.
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6398176
I am using the location object! With my way you also never get the ? at the start.

Ant
0
 
LVL 15

Accepted Solution

by:
a.marsh earned 40 total points
ID: 6398185
Here's a complete example of doing just what you want - it goes a step further and uses the actual fieldnames and values of the query string:


index.html
----------

<html>
<head>
<title>Enter your details</title>
</head>
<body>
<form action="story.html">
<table border="0" cellpadding="5" cellspacing="5">
<tr><td>Your name</td><td><input type="text" name="your_name" value=""></td></tr>
<tr><td>First friend</td><td><input type="text" name="friend1" value=""></td></tr>
<tr><td>Second Friend</td><td><input type="text" name="friend2" value=""></td></tr>
<tr><td>&nbsp;</td><td><input type="submit" value="create story..."</td></tr>
</table>
</form>
</body>
</html>



story.html
----------

<html>
<head>
<title>The Story</title>
<script language="javascript">

your_name = "test";
friend1 = "";
friend2 = "";

// Get names
var queryString = window.location.href.substring((window.location.href.indexOf('?') + 1));
var array1 = queryString.split('&'); // Each array element is in format "fieldname=value"
for(var i = 0; i < array1.length; i++){
 var tempArray = array1[i].split('='); // Separate fieldname and value
 eval(tempArray[0] + " = \"" + tempArray[1] + "\"");
}

</script>
</head>
<body>
<p>This is the story of
<script language="javascript"> document.write(your_name);</script>'s amazing adventure with
<script language="javascript"> document.write(friend1);</script> and
<script language="javascript"> document.write(friend2);</script>.
</p>
<p>Now I'm not a very good storyteller, so I'm afraid that's all you're going to hear about
<script language="javascript"> document.write(your_name);</script>,
<script language="javascript"> document.write(friend1);</script> and
<script language="javascript"> document.write(friend2);</script>'s adventure!
</p>
</form>
</body>
</html>


:o)

Ant
0
 

Author Comment

by:weiyee08
ID: 6398212
a.marsh,

var tempArray = array1[i].split('=');

eval(tempArray[0] + " = \"" + tempArray[1] + "\"");

what do above statement mean ?


document.write(your_name);

why you don't use array to display ?
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6398226
Basically:

var queryString = window.location.href.substring((window.location.href.indexOf('?') + 1));
var array1 = queryString.split('&'); // Each array element is in format "fieldname=value"


gets the query string and generates an array. The values of the array are:

fieldname=value

So in order to separate the value from the field we do a further split hence the:

var tempArray = array1[i].split('=');

This gives us an array that looks like:

tempArray[0] = "fieldname";
tempArray[1] = "value";


If you create the two files and copy and paste the code in the example above you will see it working.

:o)

Ant
0
 

Author Comment

by:weiyee08
ID: 6398236
i kow it is working, but why you don't use array to display the name ?
0
 
LVL 14

Expert Comment

by:avner
ID: 6398488
weiyee08 ,
I would change the code to use Hash-Table instead of Array.
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6398923
The name is simply stored in a variable so it can be called easily time and time again.

You could quite easily store all the names in an array.

There is always more than one way of doing the same thing!

:o)

Ant
0
 

Author Comment

by:weiyee08
ID: 6400623
a.marsh,


eval(tempArray[0] + " = \"" + tempArray[1] + "\"");

above statement will create a variable and store the value in it, right ?


avner,

what do you mean by Hash-Table ? How to do it ? Can you show me ?
Which one is the best ?
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6400629
Yes - the eval() function basically executes the string as code. So for example the first call of the loop actually does this:

eval("your_name = \"Ant\"");

assuming of course I entered the value Ant on the first page.

The eval function executes that code hence setting the variable "your_name" to the value "Ant".

:o)

Ant
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6400633
I'll let avner answer his part, I don't want to step on anyones' toes - although I think what he is suggesting is more commonly known as "associative arrays"

:o)

Ant
0
 

Author Comment

by:weiyee08
ID: 6400726
a.marsh,

I don't mind if you answer his idea as long as you are the one who answer first
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6400740
Okay, well I don't know if this is exactly what avner had in mind, but this is what I believe he is suggesting:


story.html
-----------------------------

<html>
<head>
<title>The Story</title>
<script language="javascript">

nameArray = new Array();

// Get names
var queryString = window.location.href.substring((window.location.href.indexOf('?') + 1));
var array1 = queryString.split('&'); // Each array element is in format "fieldname=value"
for(var i = 0; i < array1.length; i++){
var tempArray = array1[i].split('='); // Separate fieldname and value
eval("nameArray[\"" + tempArray[0] + "\"] = \"" + tempArray[1] + "\"");
}

</script>
</head>
<body>
<p>This is the story of
<script language="javascript"> document.write(nameArray["your_name"]);</script>'s amazing adventure with
<script language="javascript"> document.write(nameArray["friend1"]);</script> and
<script language="javascript"> document.write(nameArray["friend2"]);</script>.
</p>
<p>Now I'm not a very good storyteller, so I'm afraid that's all you're going to hear about
<script language="javascript"> document.write(nameArray["your_name"]);</script>,
<script language="javascript"> document.write(nameArray["friend1"]);</script> and
<script language="javascript"> document.write(nameArray["friend2"]);</script>'s adventure!
</p>
</form>
</body>
</html>


Ant
0
 

Author Comment

by:weiyee08
ID: 6400790
a.marsh

I think you are right. Thanks !
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6400795
Glad to help.

:o)

Ant
0

Featured Post

NAS Cloud Backup Strategies

This article explains backup scenarios when using network storage. We review the so-called “3-2-1 strategy” and summarize the methods you can use to send NAS data to the cloud

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question