Get Query String Values With Javascript
JavaScript Code To Retrieve Query String Values
This topic shows you how you can retrieve the query string values from a URL using JavaScript. The code is simple and understandable. Below is the complete code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Query String using Javascript</title>
<script type="text/javascript" language="javascript">
function getquerystring()
{
var qsarr = new Array();
var qs = location.search.substring(1);
var singleqs = new Array();
var str ="";
qsarr = qs.split('&');
for( i=0; i<qsarr.length; i++)
{
singleqs = qsarr[i].split('=');
str += 'Query String Name : <span style="color:#ff0000;">' + singleqs[0] +
'</span> and its value is : <span style="color:#ff0000;">' + singleqs[1] +'</span><br />';
}
document.getElementById("querystring").innerHTML = str;
}
</script>
<style type="text/css">
body
{
font-family:Arial;
letter-spacing:1px;
font-size:14px;
line-height:1.7em;
}
#querystring
{
width:70%;
margin:0 auto;
margin-top:20px;
}
</style>
</head>
<body>
<div style="width: 50%; margin: 0 auto; margin-top: 20px; color: Green;">
This is an example of getting query string values using javascript.<br />
Add query string values at the end of URL addres and then hit enter and clcik Get Query String Values button.<br />
<br />
<span style="color: Maroon;">For Exapmle:
</span>
Add ?val=1 at the end of URL address and then hit enter and clcik Get Query String Values button.<br />
<br />
<span style="color: Maroon;">For Multiple values in Query String</span>
Add ?val1=1&val2=2&val3=3 and soon... then hit enter and clcik Get Query String Values button.. <br />
<br /><br />
<input type="button" value="Get Query String Values" onclick="getquerystring();" />
<input type="button" value="Get Url" onclick="alert(document.URL);" />
</div>
<div id="querystring">
</div>
</body>
</html>
Copy and pate the code as save as .html file. Run the code and add query string values to URL address and hit enter.
Screenshots:
Download Link : https://docs.google.com/leaf?id=0B2iokvd3EpXAYjMwOTFiOWYtNzdlZS00Y2Y0LTg3YTMtZjIwZGUzZWJlZWVl&hl=en_US
If you like the code then comment...!
This topic shows you how you can retrieve the query string values from a URL using JavaScript. The code is simple and understandable. Below is the complete code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Query String using Javascript</title>
<script type="text/javascript" language="javascript">
function getquerystring()
{
var qsarr = new Array();
var qs = location.search.substring(1);
var singleqs = new Array();
var str ="";
qsarr = qs.split('&');
for( i=0; i<qsarr.length; i++)
{
singleqs = qsarr[i].split('=');
str += 'Query String Name : <span style="color:#ff0000;">' + singleqs[0] +
'</span> and its value is : <span style="color:#ff0000;">' + singleqs[1] +'</span><br />';
}
document.getElementById("querystring").innerHTML = str;
}
</script>
<style type="text/css">
body
{
font-family:Arial;
letter-spacing:1px;
font-size:14px;
line-height:1.7em;
}
#querystring
{
width:70%;
margin:0 auto;
margin-top:20px;
}
</style>
</head>
<body>
<div style="width: 50%; margin: 0 auto; margin-top: 20px; color: Green;">
This is an example of getting query string values using javascript.<br />
Add query string values at the end of URL addres and then hit enter and clcik Get Query String Values button.<br />
<br />
<span style="color: Maroon;">For Exapmle:
</span>
Add ?val=1 at the end of URL address and then hit enter and clcik Get Query String Values button.<br />
<br />
<span style="color: Maroon;">For Multiple values in Query String</span>
Add ?val1=1&val2=2&val3=3 and soon... then hit enter and clcik Get Query String Values button.. <br />
<br /><br />
<input type="button" value="Get Query String Values" onclick="getquerystring();" />
<input type="button" value="Get Url" onclick="alert(document.URL);" />
</div>
<div id="querystring">
</div>
</body>
</html>
Copy and pate the code as save as .html file. Run the code and add query string values to URL address and hit enter.
Screenshots:
Enjoy..
If you like the code then comment...!
I ԁo nοt еven know hοw I enԁeԁ up here, but I thought thiѕ poѕt was great.
ReplyDeleteӏ ԁon't know who you are but certainly you are going to a famous blogger if you aren't аlreаdy ;) Cheers!
My website :: crisis loan
thanx,,
DeleteI've learn some excellent stuff here. Certainly value bookmarking for revisiting. I wonder how much attempt you put to create one of these wonderful informative site.
ReplyDeleteAlso see my webpage - same day loans
thnx n u r always welcome
Deletehi...thanks for this xample..i have an issue that when i am running it by simply saving it as .html in notepad and running the html file.after adding delimiter(?)and passing any value,it is giving me an error as WINDOWS CANNOT FIND C://MYPATH.HTML?val=1 PLEASE CHECK SPELLING.please help
ReplyDeleteHello Zeeshan,
ReplyDeleteYou need to run this code by hosting this code page on a web server either local (IIS) or online web server.
thank you for sharing with us..
ReplyDeletegreat work..!
Thanx,
Jevis.