jquery - Show message after contact form validated - Bootstrap Validation -


i working bootstrap plugin , want make confirmation submit message appear (jsfiddle) form validated.

the developer of plugin notes following:

when form invalid, .preventdefault() called on submit event. result, if want hook submit event , conditionally based on whether or not form valid, can check if event .isdefaultprevented(). sure submit handler bound after plugin has been initialized on form.

so after few tries came out code (which not work):

$('#form').validator().on('submit', function (e) {   if (e.isdefaultprevented()) {     $('button').click(function(){         $('.alert').hide()     })    } else {     $('button').click(function(){         $('.alert').show()     })    } })    

what missing?

update

as @nikhil nanjappa provided solution came out problem, since contact form reloads content, message shown 1 milisecond (jsfiddle updated). there way prevent behavior?

update2

for make work, added handled form submission on "submit" event , added return false code looks this:

$('#form').on('valid.bs.validator', function(){     $('button').click(function(){         $('.alert').show()              return false;     })      $('.alert').delay(3000).fadeout( "slow" );  }); 

in same link reference had given, found event here.

valid.bs.validator - event fired when form field becomes valid. previous field errors provided.

$('#someformid').on('valid.bs.validator', function(){     showthemessage(); }); 

simple , clean. don't have use if else loops over.

updated:

you need make couple of changes:

  • firstly validator.js not working in fiddle because calling url via http protocol , jsfiddle should https, change external resource url of validator.js https://1000hz.gi....

  • secondly, form see has 2 id's. keep 1 using(formulario-cdb).

  • this main culprit of reload, without having submit handlers form getting submitted meant "send button" of type submit. change type="button"

now can see alert display , stick there without page reloading.


Comments

Popular posts from this blog

java - Suppress Jboss version details from HTTP error response -

gridview - Yii2 DataPorivider $totalSum for a column -

Sass watch command compiles .scss files before full sftp upload -