BORGET Sebastien

Pages

Home

Tutorial Description

In this tutorial, we will be dealing with XHTML, Javascript and Ampersands (you know, this character &).
When using it inside javascript code on a xhtml page inside a query string, problems will appear !

XHTML 1.0

The xhtml 1.0 reference book states that special characters like our & need to be written in the code as &. This is also the case for some other characters like:

‘&’ (ampersand) becomes ‘&’
‘”‘ (double quote) becomes ‘"’
”’ (single quote) becomes ‘'’
‘<' (less than) becomes '<'
‘>’ (greater than) becomes ‘>’

QUERY STRINGS

A very common method of passing data to a server is through the use of the query string. When passing multiple data to the server, using the GET method then we need to separate the different arguments passed. This is done by the use of the character & which separate all couples of variables-attributes.

Look at this example:

http://www.phpsoft.org/person.php?name=Sebastien&age=21

We are passing two arguments to the page person.php on the server www.phpsoft.org:

name with the value “Sebastien“
age with the value “21“

So, as you might notice, this query string contains a & and hence the xhtml 1.0 reference books clearly states that even in URLS you have to replace & with &. If you don’t do so, you will get xhtml validation errors.

Have a look here for some explanation

The Problem: Javascript

So far, we do not encounter any problems, and following the W3C recommandation will just work fine. Except if you are using query string within your javascript code, nestled in a xhtml 1.0 webpage.

Take a look at this example:

function sndAjaxReq(page, number) {
http.open(’get’, page+’.php?mode=ajax&page=’+number);
http.onreadystatechange = handleResponse;
http.send(null);
}

If we include directly this code inside a xhtml page, we should replace the & with a & to make it xhtml W3C compliant.

Now our problems are coming: when javascript executes this code with the remplace ampersand:

function sndAjaxReq(page, number) {
http.open(’get’, page+’.php?mode=ajax&page=’+number);
http.onreadystatechange = handleResponse;
http.send(null);
}

Then the arguments are not passed to the page, except the first one, because the & is nomore understood as the separator for the arguments list by the server !

So, do we have to sacrifice XHTML compliancy to make our site fonctionnal ?

A work-around

Hopefully not ! There are some work-arounds to this issue: the first is to put all the javascript code in a .js file and to put in your code in your header:

Another solution is to use the HTML comments ( <!– to open a comment, –> to close it) , so the validator will ignore your javascript code for the validation, but it will still be processed by all browsers ! This is the work around I use in my own script.

<!–
function sndAjaxReq(page, number) {
http.open(’get’, page+’.php?mode=ajax&page=’+number);
http.onreadystatechange = handleResponse;
http.send(null);
}
–>

If you have other solutions, do not hesitate to share them !

Comments (0)

*DISCOVER*
Unlimited storage & streaming of your favourite movies, songs & photos with Wixi

No Comments »

No comments yet.

RSS feed for comments on this post. TrackBack URI