1. 程式人生 > >[bootstrapValidator] - bootstrap的驗證工具

[bootstrapValidator] - bootstrap的驗證工具

tar ots efault rev val note data styles use

翻了下之前和同事做的一個驗證

<!--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 instance var $form = $(e.target); // Get the BootstrapValidator instance var 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">

[bootstrapValidator] - bootstrap的驗證工具