jquery - 表单ajax数据库检查唯一值

Lac*_*cer 1 validation jquery pdo

运用

  • jquery验证器插件
  • jQuery的

尝试:

  • 确保数据库中不存在用户名
    • 有表格+字段+远程检查
    • 我想让jquery使用ajax检查它是否存在.

什么有效:

  • check-username.php自己工作

什么不是

  • 表单似乎无法传递返回布尔值来验证远程jquery验证
  • 如何让它传递值以便可以验证字段?

HTML

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js" type="text/javascript"></script> 
    <script language="javascript" src="validate.js"></script>

    <meta name="generator" content="" />
    <style type="text/css"></style>
  </head>
<body>

<form action="/" method="post" id="register-form">
    <div>
        <label for="username">Username<font color="red">*</font>:</label> 
        <input type="text" name="username" size="20" id="username" />
    </div>
    <div>
        <input type="submit" name="submit" value="submit" />
    </div>
</form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

JQUERY验证

$().ready(function() {
    // validate signup form on keyup and submit
    $("#register-form").validate({
        rules: {
            username: {
                required: true,
                remote: "check-username.php"
                },
        },
        messages: {
            username:{
                remote: "This username is already taken! Try another."
            },
        },
    });
});
Run Code Online (Sandbox Code Playgroud)

入住USERNAME.php

<?php

$searchVal = $_POST['username'];

try {
    $dbh = new PDO("mysql:host=$hostname;dbname=$data", $username, $password);

    $sql = "SELECT * FROM users WHERE USERNAME = " . "'" . $searchVal .  "'";
    $stmt = $dbh->query($sql);
    $result = $stmt->fetch(PDO::FETCH_ASSOC);

   if($result>0){
     return true;
   }else {
     return false;
   }

    $dbh = null;
    }
        catch(PDOException $e)
    {
        echo $e->getMessage();
    }       
?>
Run Code Online (Sandbox Code Playgroud)

小智 7

为了验证服务器端的值,您应该添加新的验证方法.

$().ready(function() {

    $.validator.addMethod("checkUserName", 
        function(value, element) {
            var result = false;
            $.ajax({
                type:"POST",
                async: false,
                url: "check-username.php", // script to validate in server side
                data: {username: value},
                success: function(data) {
                    result = (data == true) ? true : false;
                }
            });
            // return true if username is exist in database
            return result; 
        }, 
        "This username is already taken! Try another."
    );

    // validate signup form on keyup and submit
    $("#register-form").validate({
        rules: {
            "username": {
                required: true,
                checkUserName: true
            }
        }
    });
});        
Run Code Online (Sandbox Code Playgroud)

如上所述,方法checkUserName将验证到服务器端,如果用户名不存在,则会显示错误消息" 此用户名已被占用!请尝试其他用户. "

有关jQuery验证及其方法的更多信息和示例:单击此处.

希望这有帮助.