Form is submitted when I click on the button in form. How to avoid this?

Question

I use twitter-boostrap and I\'d like to use these radio-buttons in my form. The problem is when I click on any of these buttons, the form is immediately submitted. How to av

Answer 1

From the fine HTML5 specification:

A button element with no type attribute specified represents the same thing as a button element with its type attribute set to "submit".

And a submits the form rather than behaving like a simple push-button.

The HTML4 spec says the same thing:

type = submit|button|reset [CI]
This attribute declares the type of the button. Possible values:

• submit: Creates a submit button. This is the default value.
• reset: Creates a reset button.
• button: Creates a push button.

So your

elements:

Button_1 Button_2

are the same as these (in compliant browsers):

Button_1
Button_2

and any time you hit one of those buttons you'll submit your form.

The solution is to use plain buttons:

Button_1
Button_2

Some versions of IE default to type="button" despite what the standard says. You should always specify the type attribute when using a just to be sure that you will get the behavior you're expecting.