Two button form: validate only if one of the button clicked ?

[chmike]

I have a two button form (A and B) and some validation rules. The validation rules are now checked when any button is clicked.

Is it possible to ignore the validation rules when button A is clicked and checked only when button B is clicked ? If yes, how could I do that ?

The use case is a login form with a sign up and a sign in button. The validation rules should only be checked when the sign in button is clicked.

[chmike]

Setting the formnovalidate attribute of the button has no effect. The validation of the form is still performed by fomantic.

I managed to create a button that skip validation by setting it’s type to "button" and adding a javascript click event handler that loads another page. Unfortunately, it’s not the same as a form submit button that would transmit the content of the form fields.

[ColinFrick]

That would be the correct way to achieve this. The type of a button element is submit by default which validates / submits the form.
You could always use an A element and style it as a button: https://jsfiddle.net/gpLyro4m/

[lubber-de]

@chmike The second submit button could remove the field rules and then submit the form as usual

$('.ui.secondary.submit.button').click(function(){
	myform.form('remove fields',['login','password']);
});

See https://jsfiddle.net/xkhepq9c/

[chmike]

@ColinFrick I didn’t know one could style an A element as a button. This allows me to drop the javascript click handler. Thank you very much for the hint.

@lubber-de what is the effect of removing the fields ? Are they simply removed from the validation process and the field values are still sent to the form action page ? Otherwise, it would have the same net effect as the A element which is simpler for me to understand and implement.

[lubber-de]

@chmike It removes all rules of the given fields. So if you remove all fields rules, the submit goes through :)

[lubber-de]

So, yes: the field values are still there and will be submitted

[chmike]

@lubber-de Excellent. It worked with my form. That’s a better solution because I wanted to get the content of the fields. Thank you very much.