thinkphp5使用bootstrapvalidator进行异步验证邮箱的示例

本文介绍了thinkphp5使用bootstrapvalidator进行异步验证邮箱的示例，分享给大家，具体如下：js

本文介绍了thinkphp5使用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验证几个注意点

1. verbose: false,代表js验证合法后再异步后台验证，这样减少服务器压力
2. data: {} ,默认传递的就是输入框的值，所以一般不用写该属性，或者为空即可

后台注意点

1. 注意不是return而是echo
2. 返回json格式 {'valid':true[,'message':'验证成功']}

参考链接： 使用bootstrapvalidator的remote验证经验

参考链接：BootstrapValidator超详细教程

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

thinkphp5 异步验证邮箱 thinkphp5 bootstrapvalidator thinkphp 验证邮箱