实用又漂亮的BootstrapValidator表单验证插件(2)

1.在页面初次加载的时候,BootstrapValidator需要按照上述方式进行加载,方可进行前端数据校验。
2.你已经看到注释的代码,也许你已经猜得到,这就是解决办法。没错,为form加上该事件处理,使用e.preventDefault();阻止默认事件提交。

五、form表单提交时验证项目

function validateCallback(form, callback, confirmMsg) { YUNM.debug("进入到form表单验证和提交"); var $form = $(form); var data = $form.data('bootstrapValidator'); if (data) { // 修复记忆的组件不验证 data.validate(); if (!data.isValid()) { return false; } } $.ajax({ type : form.method || 'POST', url : $form.attr("action"), data : $form.serializeArray(), dataType : "json", cache : false, success : callback || YUNM.ajaxDone, error : YUNM.ajaxError }); return false; }

validateCallback中获取form表单后,通过isValid方法可以返回表单验证是否通过。
当表单验证通过后,再通过ajax将表单提交到服务端。

如果大家还想深入学习,可以点击这里进行学习,再为大家附3个精彩的专题:

Bootstrap学习教程

Bootstrap实战教程

Bootstrap插件使用教程

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzpzyf.html