Working with URL Parameters in Javascript

Posted on November 8th, 2011 at 6:16 pm

No Comments »

After long time i again got opportunity to work on javascript for one of my project and i had a requirement to change the Query String parameters in the webpage URL. While creating the method for this requirement, i thought to create a Helper Javascript file which would handle Add, Update and Remove Query String Parameter in URL. You can download the JScript Helper file using the link provided at the end of this post :) .

Click here for Live Demo of Javascript Helper file to Add, Update and Remove Query String Parameter from URL. Enter Query String Parameter Name and Value and Click Add button, which would add a new query string to the URL now try updating and removing that and hangout for a while, If you find any problems/issue while working with Query String Paramters then please do post it as a comment. So that i can look into it..

Lets have a look at Helper JS file as what methods it contains, below are the method signatures which helper file contains:

  • function AddUrlParameter(url, paramName, paramValue)
    This method creates a new query string using ‘paramName’ and ‘paramValue’ and adds it to the ‘url’ provided as parameter, If there exists a url parameter with same paramName provided, then it throws a Message Box saying that ‘Url Parameter already Exists!’
  • function UpdateUrlParameter(url, paramName, paramValue)
    This method updates the existing query string with value equals paramValue where query string name equals paramName, shows up an alert box if query string name does not exists in provided URL.
  • function RemoveUrlParameter(url, paramName)
    This method removes the query string of which name equals paramName in the provided URL, shows up an alert box if query string name does not exists in provided URL.

All the above three method return New Url, which will be the required Url after adding/updating/removing the query string.

Click here to download the Javascript Query String Helper File, Or right click on link and select as ‘Save as’ to save it to your machine.
Click here to download the Sample Code

Categories : Basics, Javascript
Tags : ,
Author : Kranthi Gullapalli

Interested in this topic? You might enjoy another article we've written called

  1. Delegate in Javascript
  2. Bandwidth detection with javascript
  3. LinqToSql datacontext SubmitChanges not working, datacontext table is in readonly mode
  4. How to get checkboxlist selected item values on client side using javascript
  5. Pre load images with Javascript

Leave a Reply