Can I make a <button> not submit a form?

Question

I've got a form, with 2 buttons

<a href="index.html"><button>Cancel changes</button></a>  <button type="submit">Submit</button> 

I use jQuery UI's button on them too, simply like this

$('button').button(); 

However, the first button also submits the form. I would have thought that if it didn't have the type="submit", it wouldn't.

Obviously I could do this

$('button[type!=submit]').click(function(event) { event.stopPropagation(); }); 

But is there a way I can stop that back button from submitting the form without JavaScript intervention?

To be honest, I used a button only so I could style it with jQuery UI. I tried calling button() on the link and it didn't work as expected (looked quite ugly!).

Answer 1

The default value for the type attribute of button elements is "submit". Set it to type="button" to produce a button that doesn't submit the form.

<button type="button">Submit</button> 

In the words of the HTML Standard: "Does nothing."

Answer 2

The button element has a default type of submit.

You can make it do nothing by setting a type of button:

<button type="button">Cancel changes</button>