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.jshttps://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
. changetype="button"
now can see alert display , stick there without page reloading.
Comments
Post a Comment