Exemple de la façon dont tp5 utilise bootstrapvalidator pour vérifier le courrier électronique de manière asynchrone

Cet article présente un exemple de thinkphp5 utilisant bootstrapvalidator pour vérifier de manière asynchrone l'adresse e-mail. J'aimerais la partager avec vous. Les détails sont les suivants :

vérification 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位之间'
          }
        }
      }

    }
  });
});

Traitement TP5

  public function ajax_email(){
    //该message可以为空，它替换JS验证的message属性
    echo json_encode(['valid'=>false,'message'=>'验证码不正确']);

  }

Quelques points d'attention pour la vérification js

1. verbeux : faux, ce qui signifie que la vérification asynchrone de l'arrière-plan sera effectuée une fois que la vérification js sera légale, comme ceci Réduire la pression du serveur

2. données : {}, la valeur de la zone de saisie est transmise par défaut, donc généralement là il n'est pas nécessaire d'écrire cet attribut, ou il peut être vide

Notes en arrière-plan

1. Notez qu'il ne s'agit pas de retour mais echo

2. renvoie le format json {'valid': true[,'message':'Vérification réussie']}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!