Get URL Parameters (QueryStrings) using Javascript
Nearly all server-side programming languages have built-in functions to retrieve querystring values of a URL. In web browsers you can access the querystring with client-side JavaScript, but there is no standard way to parse out the name/value pairs. So here is a function to return a parameter you specify. The following javascript code snippet facilitates Javascript's built in regular expressions to retrieve value of the key. Optionally, you can specify a default value to return when key does not exist.
function getQuerystring(key, default_)
{
if (default_==null) default_="";
key = key.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regex = new RegExp("[\\?&]"+key+"=([^&#]*)");
var qs = regex.exec(window.location.href);
if(qs == null)
return default_;
else
return qs[1];
}
The getQuerystring function is simple to use. Let's say you have the following URL:
http://www.bloggingdeveloper.com?author=bloggingdeveloper
and you want to get the "author" querystring's value:
var author_value = getQuerystring('author');
If you execute code shown in the above line, the author_value will be bloggingdeveloper. The query string is parsed by the regular expression and the value of the author_value parameter is retrieved. The function is smart in a couple of ways. For example, if you have an anchor in your URL like our example URL above does (#top) the getQuerystring() function knows to stop before the # character. Also, if a requested parameter doesn't exist in the query string and the default value is not specified as a function parameter then an empty string is returned instead of a null.
Currently rated 5.0 by 1 people
- Currently 5/5 Stars.
- 1
- 2
- 3
- 4
- 5
Time delay in url redirection may be useful for the following conditions:
- Refresh a web page in every specified seconds.
- For displaying an "Update you Bookmark" page when a page Url has ben changed.
The html and JavaScript code for url redirection with delay is given below:
<html>
<head>
<script type="text/javascript">
function delayedRedirect(){
window.location = "/default.aspx"
}
</script>
</head>
<body onLoad="setTimeout('delayedRedirect()', 3000)">
<h2>You'll be redirected soon!</h2>
</body>
</html>
The JavaScript function setTimeout is the most important part of the code given above. Javascript setTimeout function calls delayedRedirect function after 3 seconds (3000 miliseconds).
You may find more details of setTimeout() method in JavaScript setTimeout Function - JavaScript Timing Events
Currently rated 5.0 by 2 people
- Currently 5/5 Stars.
- 1
- 2
- 3
- 4
- 5
The javascript code below shows how to set the focus on an Input Field / Form Field / Html Element (Textbox) when the page is loaded.
<html>
<head>
<script type="text/javascript">
function setFocus()
{
document.getElementById("name").focus();
}
</script>
</head>
<body onload="setFocus()">
<form>
Name: <input type="text" id="name" size="30"><br />
Surname: <input type="text" id="surname" size="30">
</form>
</body>
</html>
Currently rated 3.7 by 3 people
- Currently 3.666667/5 Stars.
- 1
- 2
- 3
- 4
- 5
In ASP.NET 1.x, it is not possible to programmatically set focus to a web server control without using the JavaScript's focus() function after submit (on Page Load / after Postback). You may find the details on how to set focus to web controls in ASP.NET 1.x in one of my previous articles: Set Focus After PostBack in ASP.NET 1.x - Setting Focus to an ASP.NET Control
More...
Currently rated 3.7 by 3 people
- Currently 3.666667/5 Stars.
- 1
- 2
- 3
- 4
- 5
Management of control focus is one of the common tasks when building web applications with effective and friendly user interface. In order to set focus on a certain control such as textboxes, buttons dropdowns after postback / after submit / on Page Load in ASP.NET 1.x, we can use a dynamic javascript block that facilitates Javascript’s focus() function.
More...
Currently rated 5.0 by 2 people
- Currently 5/5 Stars.
- 1
- 2
- 3
- 4
- 5
When you write JavaScript, you need to know what string manipulation methods/functions are available.
JavaScript substring() Method
JavaScript substring is used to take a part of a string. The syntax of JavaScript substring method is given below:
stringObjectToTakeAPartOf.substring(start-index,stop-index)
- start-index: (Required - Numeric Value) - where to start the extraction
- stop-index: (Optional - Numeric Value) - where to stop the extraction
More...
Currently rated 4.2 by 9 people
- Currently 4.222222/5 Stars.
- 1
- 2
- 3
- 4
- 5
The JavaScript parseFloat() function, parses a string and returns the first floating point number in the string.
The parseFloat() function determines if the first character in the string argument is a number, parses the string from left to right until it reaches the end of the number, discards any characters that occur after the end of the number, and finally returns the number as a number (not as a string).
More...
Currently rated 5.0 by 2 people
- Currently 5/5 Stars.
- 1
- 2
- 3
- 4
- 5
The JavaScript parseInt() function parses a string and returns the first integer in a string.
There are two arguments one of which is mandatory string argument that is the string which is parsed to return the integer. The other argument is the optional radix argument that specifies the base of the integer and can range from 2 to 36. For example, 16 is the hexidecimal base (0123456789ABCDEF).
If no radix argument is provided or if it is assigned a value of 0, the function tries to determine the base:
- If the string begins with "0x", the radix is 16 (hexadecimal)
- If the string begins with "0", the radix is 8 (octal). This feature is deprecated
- If the string begins with any other value, the radix is 10 (decimal)
More...
Currently rated 3.7 by 3 people
- Currently 3.666667/5 Stars.
- 1
- 2
- 3
- 4
- 5
The JavaScript History object - property of the window object - contains an array / list of previously visited URLs. In this article, we will look at the history object properties and methods, length, current, next, previous properties, back(), forward() and go() methods along with syntax and examples.
More...
Currently rated 4.3 by 6 people
- Currently 4.333333/5 Stars.
- 1
- 2
- 3
- 4
- 5
In my previous article 7 Easy-to-Apply Tips to Improve Your Web Site Performance, I described methods to achieve better client-side performance. The conclusion of the article was: “The most important and effective way to improve web site performance is to make fewer HTTP Requests.”
Since browsers only are able to download two components on parallel per hostname, and every HTTP request has an average round-trip latency of 0.2 seconds, that causes a 2 second latency alone, if the site is loading 20 items, regardless of whether they are style sheets, images or scripts. (On an average broadband connection with a browser capable of downloading two components at a time).
Since browsers spend approximately 80% of the time fetching external components such as scripts, style sheets and images. Reducing the number of HTTP requests has the biggest impact on improving website performance. Moreover, it is the easiest way to make a performance improvement.
This article focuses on ways of minimizing HTTP Requests to maximize web site performance.
More...
Currently rated 3.5 by 17 people
- Currently 3.470588/5 Stars.
- 1
- 2
- 3
- 4
- 5