Site Navigation

Saturday, September 15, 2007

bug 223 - Magical HTTP Get Requests in IE6

Issue: #223
Affects: IE6 (& possibly earlier)
Fixed in: IE7

In IE6, it is possible to send an HTTP Get Request, without using ActiveX, XMLHTTPRequests, AND not have the user know that a request was sent, nor return a rendered response to the user! Welcome to "Magical HTTP Get Requests"!

The trick, is the result of a bug. There should be a visual clue that the request was sent, and also a rendered response.

So what do you need to make these "magical" requests?


  1. A hyperlink with an onclick attribute that calls...

  2. A JavaScript function that sets the location.href value...

  3. and an href attribute with a javascript: protocol value that does nothing



Example:

<script type="text/javascript>
function doThis(){
//do any logic you want... then try to go somewhere...
if(confirm('Do you want to silently go to a Naughty site?')){
//go there, silently!
document.location.href = 'http://www.someNaughtyUrl.com/';
}
}
</script>
<p>Click the following link in IE6. You won't go anywhere... visually, but you will send an HTTP Request!
<p>
<a href="javascript:;" onclick="doThis();">Magic Request</a>


If you try this out, you won't see IE6 leave the page you are on. In fact, you won't even see the throbber spin! Best of all, you won't even see the page in your History! but then again, you won't even see the page!

So you might wonder when you would ever encounter such a scenario? Very simple. If you want your link to be properly styled as a link using CSS, you need the href attribute, or it won't look right, show the right pointer cursor, animate on hover, or be tab-able via the keyboard etc. However, you may need to get confirmation before continuing (e.g. "do you want to save your changes?"), other JavaScript logic, or simply create an un-cancel-able request (see web design sidenote #3).


Known Workarounds: One. Change the href link to not include the javascript: protocol.

Example Workaround Code:
Use the hash anchor naming option. If you use a non-existent value, then the browser won't scroll either! ;-)

<a href="#none" onclick="doThis();">This works</a>



Related Issues: None. This issue is also fixed in IE7.