javascript - required attribute not working when submitting forms using submit() -

so have input fields in form this:

<input name="blotter_entry_nr" type="text" class="form-control" id="arrest"                      placeholder="enter blotter no." required> 

i submitted form using following code:

//handle toolbar event     $('#toolbarbutton').on('toolbaritemclick',         function (event, buttonclicked) {             var targetblock = $(event.target).parents('.article') // article             var buttonclickedid = buttonclicked.id // id of button click              switch (buttonclickedid) {                 case 'savebutton':                     $( "#case-report-form" ).submit();                     break;                 case 'menu-remove':                     removearticle(targetblock)                     break;             }     });  //handle form submission     $("#case-report-form").on('submit',(function(e){         e.preventdefault();          var formdata = new formdata(this);            csr.submitform.submit(formdata);     })); 

the problem is, when dont provide input on required fields, submission still continue. try submit form using , , required attributes working.

can share his/her thoughts regarding this. thanks.

you submitting form via javascript, calling submit method – , in case, possible invalid form state not supposed cancel form submission.

html5, 4.10.22.3 form submission algorithm, step 4:

if submitted submit() method flag not set, , submitter element's no-validate state false, interactively validate constraints of form , examine result: if result negative (the constraint validation concluded there invalid fields , informed user of this) fire simple event named invalid @ form element , abort these steps.

since using submit method submit form, submitted submit() method flag is set, , therefor rest of step not apply – browser not supposed cancel submission process @ point, if form in invalid state. (in fact, browser not supposed run validation algorithm in case.)

you can check validity of form via script well, before call submit method – that’s checkvalidity method for.

(you might want check if browser supports method though before calling – otherwise code break in browsers have not implemented yet.)