javascript - 使用语法电子邮件检查器实现实时电子邮件检查器

Question

我按照一个例子，http://formvalidation.io/examples/using-data-returned-validator/ ，并且能够对电子邮件和用户名实现简单的验证。我找到了另一个使用 ajax 调用实时电子邮件检查器 php 脚本的演示/示例。

我还没有弄清楚的是如何实现(结合)实时用户名检查器和标准验证器，这样它既可以检查电子邮件的格式是否有效，又可以使用，而不是注册成员(member)已经。搞乱 javascript，我已经让验证器看到我的 php 脚本，check_email.php 使用 AJAX post。

但是我没有正确的语法来让验证器利用 php 脚本的结果来返回诸如“重复”或“电子邮件正在使用”之类的消息。电子邮件的 html:

<!-- EMAIL -->
<div class="form-group">
  <div class="row">
    <label class="col-xs-6 control-label">Email address</label>
    <div class="col-xs-6"  style='clear:left;width: 50%;'>
      <input type="text" class="form-control email" name="email" />
    </div>
  </div>
</div>

javascript的相关部分:

<script>
  $(document).ready(function() {
    $('#taskForm').formValidation({
      framework: 'bootstrap',
      icon: {
        // required: 'fa fa-asterisk',
        valid: 'glyphicon glyphicon-ok',
        invalid: 'glyphicon glyphicon-remove',
        validating: 'glyphicon glyphicon-refresh'
      },
      fields: {

        'email': {
           validators: {
            notEmpty: {
              message: 'The email address is required'
            },
            emailAddress: {
              message: 'The input is not a valid email address'
            }
            ,
            remote: {
              type: 'POST',
              url: 'check_email.php',
              message: 'Duplicate or whatever ...',
              cache: false,
              success: function(result){
                var result=remove_whitespaces(result);
                if(result=='')
               {
                  // Do something ...
                }
              }
            }
          }
        },
      }
    })
  });
</script>

要查看演示表单，请访问 http://dottedi.us/validation/validator.php .为了说明实时检查器的工作原理，请使用“sowhat”的用户名和“sowhat@dottedi.biz”的电子邮件地址进行测试。我让用户名与用户名检查器分开工作，只是为了证明它有效，而不是所需的方法。电子邮件目前因我的代码而损坏。

如有必要，我可以修改 check_email.php。目前它返回 $HTML='email exists';如果是重复的。

问题:如何更改远程函数的结构和语法，以便它可以使用来自 check_email.php 的响应？

哦，这是 check_email.php 中的 php 代码:

<?php
include ("mysql_connection.php");

$HTML = "";
if(isset($_POST['email']) && !empty($_POST['email']))
{
  $email=strtolower(mysql_real_escape_string($_POST['email']));
  $query="select * from members where LOWER(email)='$email'";
  $res=mysql_query($query);
  $count=mysql_num_rows($res);

  if($count > 0){ $HTML='email exists'; }else{ $HTML=''; }
}

echo $HTML;

?>

Answer 1

我一直在挖掘并在以下位置找到了答案:http://formvalidation.io/validators/remote/

1) 将相关的 javascript 更改为:

remote: {
    message: 'This email address is taken',
    url: 'check_email.php',
    type: 'POST'
}

2) 更改 check_email.php 以返回 JSON 格式响应:

if ( $count > 0 ) { $status = false; } else { $status = true; }

if(isset($status))
{
  $data = array(
    "valid"     => $status,
    "email"     => $email // OPTIONAL
  );
 echo json_encode($data);
}