Menu
I apologize in advance if this is covered in the docs, but I can't seem to find it.
I have a pretty straightforward form which uses several buttons as I'm using twitter bootstrap. The problem is that clicking any of the buttons in the form seems to trigger a submit event to angular: In my form there are several input fields in which I use the "require" attribute and so clicking any button opens a dialog saying the field is required. This is all well and good, except I only want the validation to take place when the user clicks the actual submit button.
I have tried setting the ng-submit to a function which so far only returns false, but this did not seem to have any effect.
Update: I've found a temporary workaround using a directive which uses event.preventDefault(). However this seems a bit excessive and also means I have to attach it to every button.
<div class="row-fluid"> <div class="span12"> <form ng-submit="onSubmit()" class="form-horizontal"> <div class="row-fluid"> <div class="span12"> <div class="katana-technician-form"> <div class="control-group"> <label class="control-label">Tekniker <div class="controls"> <div class="input-append"> <input type="text" class="span2" /> <div class="btn-group"> <!-- Triggers onSubmit--> <button data-toggle="dropdown" class="btn dropdown-toggle">Velg<span class="caret"></span> </button> <ul class="dropdown-menu"> <li>Kake</li> <li>Bake</li> </ul> </div> </div> </div> </label> </div> </div> </div> </div> <div class="row-fluid"> <div class="span12"> <!-- Triggers onSubmit--> <button type="submit"></button> </div> </div> </div> </form> </div> </div> 
263
You may want to add a 'reset' or 'cancel' button to your form. When doing so, be wary of the type property passed to your <button/> . This can cause all buttons within your form to trigger onSubmit .
Yes, structurally the submit button needs to be inside a form element for the document to be valid X/HTML.
The simplest solution to prevent the form submission is to return false on submit event handler defined using the onsubmit property in the HTML <form> element.
If you don't have any submit button it is acceptable after all it is an element of form tag and if it is not required you may not add it with in form . This will not broke any web standard.
You should try setting type="button" on the buttons.
This question goes into detail as to what this does.
57
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
