[bootstrapValidator] - bootstrap的验证工具
生活随笔
收集整理的這篇文章主要介紹了
[bootstrapValidator] - bootstrap的验证工具
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
翻了下之前和同事做的一個驗證
<!--bootstrapValidator--> <script type="text/javascript" th:inline="none">$(function () {$('form').bootstrapValidator({message: 'This value is not valid',feedbackIcons: {valid: 'glyphicon glyphicon-ok',invalid: 'glyphicon glyphicon-remove',validating: 'glyphicon glyphicon-refresh'},fields: {memberName: {message: '用戶名驗證失敗',validators: {notEmpty: {message: '用戶名不能為空,請重新輸入'},stringLength: {min: 2,max: 18,message: '用戶名長度必須在2到18位之間'},regexp: {//適用于判斷中英文姓名,鑒于英文姓名中間常有空格,所以也加入了適用空格的判斷;中文姓名也支持空格以及“·”的匹配 regexp: /^[\u4E00-\u9FA5A-Za-z\s]+(·[\u4E00-\u9FA5A-Za-z]+)*$/,message: '姓名格式錯誤,請重新輸入'}}},memberPhone: {validators: {notEmpty: {message: '手機號碼不能為空,請重新輸入'},regexp: {regexp:/^1[34578]\d{9}$/,message: '手機號碼格式有誤,請重新輸入'}}},memberIdentity:{validators:{notEmpty:{message:'身份證號碼不能為空,請重新輸入'},regexp:{regexp:/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,message:'身份證號碼格式有誤,請重新輸入'}}},memberCarnumber:{validators:{notEmpty:{message:'車牌號碼不能為空,請重新輸入'},regexp:{regexp:/^(([京津滬渝冀豫云遼黑湘皖魯新蘇浙贛鄂桂甘晉蒙陜吉閩貴粵青藏川寧瓊使領][A-Z](([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津滬渝冀豫云遼黑湘皖魯新蘇浙贛鄂桂甘晉蒙陜吉閩貴粵青藏川寧瓊使領][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9掛學警港澳使領]))$/,message:'車牌號碼格式有誤,請重新輸入'}}}}}).on('success.form.bv',function(e){// Prevent form submission e.preventDefault();// Get the form instancevar $form = $(e.target);// Get the BootstrapValidator instancevar bv = $form.data('bootstrapValidator');// Use Ajax to submit form data $.post($form.attr('action'), $form.serialize(), function(result) {console.log(result);alert(result.code);alert(result.message);if(result.code==1){window.location.href="/showCards?cardType="+ $form.serialize()[9];}}, 'json');});});</script>需要引入bootstrapValidator的js和css文件
<!--bootstrapValidator--><script th:src="@{/js/bootstrapValidator.min.js}"></script><link th:href="@{/css/bootstrapValidator.min.css}" rel="stylesheet">?
轉載于:https://www.cnblogs.com/ukzq/p/10287187.html
總結
以上是生活随笔為你收集整理的[bootstrapValidator] - bootstrap的验证工具的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 9.控制流语句_for循环
- 下一篇: Java™ 教程(Set接口)