Question

I am trying to add a few “next” and “back” buttons to a form. The Idea is to divide the filling-out process into several steps and with these buttons, the div of the current step gets hidden and the next resp. previous step is displayed.

My Problem is that when I add buttons in the following way…

<button class="proceed_button" id="loan_information">Proceed</button>
<button class="cancel_button" id="loan_information">Cancel</button>

… they submit the form.
Is every button inside a form-tag considered to be a submit-button?
If so, how can I change this behavior?
If not, why are they doing it then?

Answer 1

Ok, the solution is that the button needs a type.

<button type="button" class="proceed_button" id="loan_information">Proceed</button>
<button type="button" class="cancel_button" id="loan_information">Cancel</button>

Like this, it won’t submit the form anymore.

According to http://w3schools.com/html5/att_button_type.asp the default type is depending on the browser, so you should always specify the type.