How to fix a link to input type button if it doesn’t work in IE 7.0/8.0

If you use a form button (or input of button type, either one) within an anchor, instead of using text or creating a graphic. This link will work fine in across all other browsers but IE either 7.0 or 8.0. Even though the correct URL in the status line and the tooltip is showing, it DOES NOT initiate the link.

The code is initially coded:

<a href="http://www.adomain.com/anypage.html"><input type="button" name="mybutton" value="Click Me" class="blue_btn"></a>

There’re a few ways you can fix it.

Method 1: Use form around the input. This technique will make sure that it always works in all browsers including IE. If the link to a page that is non html/php/jsp/asp such as .pdf, jpg,… you may want to use method 2 below. The <form> method doesn’t do any good in this case.

<form action="http://www.adomain.com/anypage.html">
<input type="submit" value="Click Me" class="blue_btn">
</form>

Method 2: Use onClick Javascript plugged in directly to the input tag, or call a JavaScript function that will open another page.

This Script will open a page within the same frame.

<input type="button" class="blue_btn" onClick="top.window.location='http://www.adomain.com/anypage.html">

This Script will open another page in another frame.

<input type="button" onClick="window.location='http://www.adomain.com/anypage.html">