Passing Parameters Via Query Strings

1. Write Querystrings

Join the Discussion

Questions? Comments?

More of this Feature

The Read Function Read Querystrings

One of the easiest methods of passing information between pages is to pass the information in a query string on the end of the address of the page you are calling. To do this we need to do two things, first we need to add the information to be passed to the end of the link and second we need to process that information on the page that is linked to. How this works is best shown if we look at an example.

Let's say that we want to pass a product code and description from one page to another. We have three different products, a red coat (product code CR), a green coat (product code CG), and a blue coat (product code CB). We can create links that will pass the product code and description to the purchases page by coding three web links as follows:

<a href="purchases.htm?code=CR&desc=Red%20Coat">
continued from previous lineRed Coat</a><br />
<a href="purchases.htm?code=CG&desc=Green%20Coat">
continued from previous lineGreen Coat</a><br />
<a href="purchases.htm?code=CB&desc=Blue%20Coat">
continued from previous lineBlue Coat</a><br />

The query string containing the values to be passed is separated from the address of the page that we are passing the parameters to by a question mark (?), each parameter being passed is separated from the next by an ampersand (&), the name of each field is separated from the value of the field by an equals sign (=), and any non alphanumeric characters in the field values is "escaped" (eg. spaces are replaced by %20).

As you can see no Javascript is required to pass the parameters using a query string. Where the Javascript comes in is that HTML has no way to read and process a query string passed to it. The query string can only be processed using a server side scripting language such as Perl or PHP or by a client side scripting language - Javascript.

Next let's look at the Javascript read function that we can use to extract the values passed in the query string into an array.

1 | 2 | 3