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

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

黄舟

Libérer： 2023-03-16 19:56:01

original

1811 Les gens l'ont consulté

Cet article présente un exemple de thinkphp5 utilisant bootstrap validator 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 () {
  $(&#39;form&#39;).bootstrapValidator({

    message: &#39;This value is not valid&#39;,
    feedbackIcons: {
      valid: &#39;glyphicon glyphicon-ok&#39;,
      invalid: &#39;glyphicon glyphicon-remove&#39;,
      validating: &#39;glyphicon glyphicon-refresh&#39;
    },

    live: &#39;disabled&#39;,//验证失败后，提交按钮仍然是可选状态

    fields: {
      email: {
        message: &#39;用户名验证失败&#39;,//默认
        verbose: false,
        validators: {
          notEmpty: {
            message: &#39;邮箱不能为空&#39;
          },
          emailAddress: {
            message: &#39;邮箱地址格式有误&#39;
          },
          remote: {
            url: &#39;/ajax_email&#39;,
            message:"此邮箱已经注册",
            type: "post",
            dataType: &#39;json&#39;,
            data: {
              //默认传递的就是输入框的值
            },
            delay: 500,//延迟效果
          },
        }
      },
      password: {
        validators: {
          notEmpty: {
            message: &#39;邮箱地址不能为空&#39;
          },
          stringLength: {
            min: 6,
            max: 18,
            message: &#39;用户名长度必须在6到18位之间&#39;
          },
        },
      },
      password2: {
        validators: {
          notEmpty: {
            message: &#39;确认密码不能为空&#39;
          },
          identical: {
            field: &#39;password&#39;,
            message: &#39;两次密码必须一致&#39;
          }
        }
      },
      username:{
        validators: {
          notEmpty: {
            message: &#39;用户名不能为空&#39;
          },
          stringLength: {
            min: 2,
            max: 8,
            message: &#39;用户名长度必须在2到8位之间&#39;
          }
        }
      }

    }
  });
});

Copier après la connexion

Traitement TP5

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

  }

Copier après la connexion

Quelques points d'attention pour la vérification js

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
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