This code may be considered as a utility tool to its users for creating, modifying, accessing http query strings with GET/POST very easily using JavaScript from client side.
Now a days, when working with raw Ajax, we need to create and manipulate the query strings at the client side using JavaScript and send it to the server. Sometimes, specially when relatively large data are transmitted in query string it may get painful to modify one of the data once added to the list and so on.
To help this task, this utility should be very helpful to its users. Also its simple to use as it is developed using Object Oriented JavaScript code.
The code contains two segments
1. The Utility Routine.
2. The Test method demonstrating how to make use of the Utility Routine.
// The class for Creating HTTPQueryString
function HttpQueryStringBuilder()
{
//Holds the Url
this.Url = '';
//Holds the Array of Key Value Pairs
this.Pairs = new Array();
//The method for getting the final query string
HttpQueryStringBuilder.prototype.GetFullString = function()
{
var queryString = (this.Url.length > 0) ? this.Url + "?" : '';
for(var key in this.Pairs)
{
queryString += escape(key) + "=" + escape(this.Pairs[key]) + "&";
}
return queryString.substring(0, queryString.length - 1);
}
}
////////////////////////////////////////
//
// The Test() Method is added for demonstration purpose only
// Delete this method when you are done with testing
//
////////////////////////////////////////
function Test()
{
//Define the Object
var builder = new HttpQueryStringBuilder();
//Supply values
builder.Url = "http://www.google.com"
//Pairs[Key] = value (Dont worry about url encoding, it will be handled automatically)
builder.Pairs["FirstName"] = "S M";
builder.Pairs["LastName"] = "Sohan";
builder.Pairs["EMail"] = "sohan39@gmail.com";
//Done with insertions! show it!
alert(builder.GetFullString());
//Make some changes
builder.Pairs["FirstName"] = "Sheikh Mohammad";
builder.Pairs["EMail"] = "sohan39@yahoo.com";
//Done with modifications! show it again!
alert(builder.GetFullString());
}
To use the supplied Test code you may have a markup like this in one of your pages
<script type="text/javascript" src="HttpQueryStringBuilder.js"></script>
<input type="button" value="Button" onClick="Test()" />
| You must Sign In to use this message board. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
