用户名输入如果其他块无法正常工作/ Javascript - jQuery - AJAX

时间:2016-05-10 12:43:35

标签: javascript jquery ajax forms

你好我有一份报名表。现在我正在编写用户名检查部分。如果所有这些都是okey,我想制作3个控件我想显示提交按钮。它应该是那样的。

  

但它始终显示我的第一个阻止:

     
    

Kullanıcıadı3ile 20karaktersrasındalmalıdır。

  

myscript.js

$(document).ready(function() {

    var uname = false;
    var umail = false;
    var upass = false;
    var rpass = false;

    $("#rname").keyup(function() {

        var username = $('#rname').val().length;

        if ((username > 3) && (username < 20)) {

            uname = true;

            if (uname == true) {

                var chars = /^[a-zA-Z0-9\.\_]*$/;

                $("#rname").keyup(function() {

                    var value = this.value;

                    if(chars.test(value) == true) {

                        uname = true;

                        if (uname == true) {

                            $("#rname").keyup(function() {

                                var user_name = $('#rname').val();

                                $.post("check.php", { username: uName },
                                function(result){

                                    $("#notName").html(result).show();

                                })

                            });     // Check is the username available.

                        };

                    } // if chars okey

                    else {

                        uname = false;
                        $("#notMail").html("Kullanıcı adın sadece harf, rakam, alt çizgi ve nokta içerebilir.").show();

                    }

                });     // Check not allowed chars in username.

            }; // if lenght okey

        } // usernamelenght

        else {

            uname = false;
            $("#notName").html("Kullanıcı adı 3 ile 20 karakter arasında olmalıdır.").show();

        }

    });     // keyup

});     // Document ready

的index.html

<?php
    require_once "check.php";
?>

<html>
<head>
    <title>jQuery</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="sstyle.css"/>
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:' rel='stylesheet' type='text/css'>
</head>
<body>
    <div class="formwrapper">
        <form method="post" action="" name="form">
            <input type="text" id="rname" class="inputa" name="username" placeholder="Kullanıcı Adı">
            <span id="notName"></div>
        </form>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script src="myscript.js"></script>
</body>
</html>

check.php

<?php

    $DB_host = "localhost";
    $DB_name = "dbeva";
    $DB_user = "root";
    $DB_pass = "";

    try {

        $DB_con = new PDO("mysql:host={$DB_host};dbname={$DB_name}",$DB_user,$DB_pass);
        $DB_con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

        }

    catch(PDOException $e) {

        echo $e->getMessage();

        }

    if (isset($_POST["username"])) {

        $username = $_POST["username"];

        $stmt = $DB_con->prepare("SELECT user_name FROM users WHERE user_name=:uname");
        $stmt->execute(array(':uname'=>$username));
        $row = $stmt->fetch(PDO::FETCH_ASSOC);

        if($row['user_name'] == $username) {

            echo "Not";

        }

        else {

            echo "Okey";

        }
    }
?>

1 个答案:

答案 0 :(得分:1)

@Brown我修改了你的代码。可能此代码有助于您解决该问题。

$(document).ready(function() { 
    $("#rname").keyup(function() {

            var username = $('#rname').val();

      var uname = checkUsername(username);
      if (!uname) return;

      var umail = charValidation(username);
      if (!umail) return;

            // code to show button...

    }); 
});   


function checkUsername(username){
     var charLength = username.length;
   if((charLength > 3) && (charLength < 20)){           
      if (checkUsernameAlreadyExists(username)) {
                    $("#notName").html("Not exists").show(); //is not already exists.
            return true;
      } 
      else{
        $("#notName").html("Already Exists ").show(); //is already exists.
        return false;
      } 
   }
   else{
     $("#notName").html("Kullanıcı adı 3 ile 20 karakter arasında olmalıdır.").show();
     return false;
   }                
}

function charValidation(username){
    var chars = /^[a-zA-Z0-9\.\_]*$/;
  if(chars.test(username)){
        return true;
  } 
  else{
    $("#notMail").html("Kullanıcı adın sadece harf, rakam, alt çizgi ve nokta içerebilir.").show();
    return false;
  }
}
function checkUsernameAlreadyExists(username){
    $.post("check.php", { username: username },function(result){
     return result;  //true or false;
  });   
}