检查电子邮件是否存在时不显示 jQuery 验证消息

Question

我正在使用 jQuery 验证器来验证表单。我正在检查电子邮件 ID 是否已存在于运行正常的数据库中。我在Network->Response tab 中得到输出。

问题是我无法在表单中显示该验证错误消息。我也设置了消息规则，但没有显示。

你能帮我解决这个问题吗？ 检查下图。

表格

<form name="form1" method="post" action="demo1.php">
  <input type="text" name="name" id="name" placeholder="name"><br />
  <input type="email" name="email" id="email" placeholder="email"><br />
  <input type="text" name="mobile" id="mobile" placeholder="mobile no"><br />
  <input type="submit" name="submit" value="submit">
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/additional-methods.min.js"></script>
<script  src="assets/js/test.js"></script>

test.js

// When the browser is ready...
  $(function() {
    $("form[name='form1']").validate({
      // Specify the validation rules
      rules: {
        name:{
          required: true,
          minlength: 3,
          maxlength: 50
        },
        email: {
          required: true,
          email: true,
          remote: {
            url: "process?key=emailalready_register",
              type: "post"
            }
          },
          mobile: {
            required: true,
            number: true,
            minlength: 10,
            maxlength: 10
          }
        },
        messages: {
          email: {remote: "Email already in use!"}
        },
        submitHandler: function(form) {
        form.submit();
      }           
    });    
  });

Process.php

function emailalready_register($conn){
  if(isset($_POST['email'])) {
    $email =$conn->real_escape_string(trim($_POST['email']));
    $sql_check_email="SELECT email FROM register WHERE email =?";
    $stmt = $conn->prepare($sql_check_email);
    $stmt->bind_param("s", $email);
    $stmt->execute();
    $stmt->bind_result($email);
    $rows = $stmt->fetch();
    $total_rows = count($rows);
    if( $total_rows > 0 ){
      echo 'Already exsist';
    } else {
      echo 'Not exsist';
    }
    $stmt->close();
    $conn->close();
  }   
}

Answer 1

试试这个：-

$(function() {
    $("form[name='form1']").validate({
      // Specify the validation rules
      rules: {
        name:{
          required: true,
          minlength: 3,
          maxlength: 50
        },
        email: {
          required: true,
          email: true,
          remote: "process?key=emailalready_register",

          },

          mobile: {
            required: true,
            number: true,
            minlength: 10,
            maxlength: 10
          }
        },
        messages: {
          email: {remote: "Email already in use!"}
        },
        submitHandler: function(form) {
        form.submit();
      }           
    });    
  });

处理.php

function emailalready_register($conn){
  if(isset($_POST['email'])) {
    $email =$conn->real_escape_string(trim($_POST['email']));
    $sql_check_email="SELECT email FROM register WHERE email =?";
    $stmt = $conn->prepare($sql_check_email);
    $stmt->bind_param("s", $email);
    $stmt->execute();
    $stmt->bind_result($email);
    $rows = $stmt->fetch();
    $total_rows = count($rows);
    if( $total_rows > 0 ){
      echo 'false';
    } else {
      echo 'true';
    }
    $stmt->close();
    $conn->close();
  }   
}

Answer 2

注意：您的邮件检查中给出的网址是错误的。

将您的 test.js 更改为：

$(function() {
    $("form[name='form1']").validate({
      // Specify the validation rules
      rules: {
        name:{
          required: true,
          minlength: 3,
          maxlength: 50
        },
        email: {
          required: true,
          email: true,
          remote: {
            url: "process.php",
           type: "post",
           dataFilter: function(data) {
                      var json = JSON.parse(data);
                      return "\"" + json.msg + "\"";
           }
            }
          },
          mobile: {
            required: true,
            number: true,
            minlength: 10,
            maxlength: 10
          }
        },
        messages: {
          email: {remote: "email is in use!"}
        },
        submitHandler: function(form) {
        form.submit();
      }           
    });    
  });

将您的 process.php 更改为：

<?php 

    /* if(isset($_POST['email'])) {
        //make your $conn available here
        $email =$conn->real_escape_string(trim($_POST['email']));
        $sql_check_email="SELECT email FROM register WHERE email =?";
        $stmt = $conn->prepare($sql_check_email);
        $stmt->bind_param("s", $email);
        $stmt->execute();
        $stmt->bind_result($email);
        $rows = $stmt->fetch();
        $total_rows = count($rows);
        if( $total_rows > 0 ){
            echo json_encode(array("msg"=>"Already exists"));
        } else {
            echo json_encode(array("msg"=>"Not exists"));
        }
        $stmt->close();
        $conn->close();
    }
 */

echo json_encode(array("msg"=>"Already exists"));

注意：这是用于消息的演示，因此它将始终显示"Already exists"。 comment 最后一行，un-comment process.php 的其余部分并检查。请查找 process.php 代码并检查它是否正常工作。

Answer 3

您可以在html 中放置一个 div 并定位到输出消息，如下所示：

<div class="messages"></div>

Answer 4

您的 PHP 文件应该返回 true 或 false。