How to create a HTML Cancel button that redirects to a URL
There is no button type="cancel"
in html. You can try like this
<a href="http://www.url.com/yourpage.php">Cancel</a>
You can make it look like a button by using CSS style properties.
There are a few problems here.
First of all, there is no such thing as <button type="cancel">
, so it is treated as just a <button>
. This means that your form will be submitted, instead of the button taking you elsewhere.
Second, javascript:
is only needed in href
or action
attributes, where a URL is expected, to designate JavaScript code. Inside onclick
, where JavaScript is already expected, it merely acts as a label and serves no real purpose.
Finally, it's just generally better design to have a cancel link rather than a cancel button. So you can just do this:
<a href="http://stackoverflow.com/">Cancel</a>
With CSS you can even make it look the same as a button, but with this HTML there is absolutely no confusion as to what it is supposed to do.
cancel
is not a valid value for a type attribute, so the button is probably defaulting to submit
and continuing to submit the form. You probably mean type="button"
.
(The javascript:
should be removed though, while it doesn't do any harm, it is an entirely useless label)
You don't have any button-like functionality though, so would be better off with:
<a href="http://stackoverflow.com"> Cancel </a>
… possibly with some CSS to make it look like a button.