一文講解thinkphp5如何進行異步驗證郵箱

thinkphp框架教程欄目將給大家介紹thinkphp5使用bootstrapvalidator進行異步驗證郵箱的方法,希望對需要的朋友有所幫助!

一文講解thinkphp5如何進行異步驗證郵箱

TP5使用bootstrapvalidator進行異步驗證郵箱

JS驗證

/**  * Created by HONGXIN on 2017-10-23.  */ $(function () {     $('form').bootstrapValidator({          message: 'This value is not valid',         feedbackIcons: {             valid: 'glyphicon glyphicon-ok',             invalid: 'glyphicon glyphicon-remove',             validating: 'glyphicon glyphicon-refresh'         },          live: 'disabled',//驗證失敗后,提交按鈕仍然是可選狀態          fields: {             email: {                 message: '用戶名驗證失敗',//默認                 verbose: false,                 validators: {                     notEmpty: {                         message: '郵箱不能為空'                     },                     emailAddress: {                         message: '郵箱地址格式有誤'                     },                     remote: {                         url: '/ajax_email',                         message:"此郵箱已經注冊",                         type: "post",                         dataType: 'json',                         data: {                             //默認傳遞的就是輸入框的值                         },                         delay: 500,//延遲效果                     },                 }             },             password: {                 validators: {                     notEmpty: {                         message: '郵箱地址不能為空'                     },                     stringLength: {                         min: 6,                         max: 18,                         message: '用戶名長度必須在6到18位之間'                     },                 },             },             password2: {                 validators: {                     notEmpty: {                         message: '確認密碼不能為空'                     },                     identical: {                         field: 'password',                         message: '兩次密碼必須一致'                     }                 }             },             username:{                 validators: {                     notEmpty: {                         message: '用戶名不能為空'                     },                     stringLength: {                         min: 2,                         max: 8,                         message: '用戶名長度必須在2到8位之間'                     }                 }             }          }     }); });

TP5處理

    public function ajax_email(){         //該message可以為空,它替換JS驗證的message屬性        echo json_encode(['valid'=>false,'message'=>'驗證碼不正確']);      }

js驗證幾個注意點

  • verbose: false,代表js驗證合法后再異步后臺驗證,這樣減少服務器壓力
  • data: {} ,默認傳遞的就是輸入框的值,所以一般不用寫該屬性,或者為空即可

后臺注意點

  • 注意不是return而是echo
  • 返回json格式 {‘valid’:true[,’message’:’驗證成功’]}

? 版權聲明
THE END
喜歡就支持一下吧
點贊6 分享