我想验证我的注册表上的用户输入:
<form action="../DB files/registerDB.php" onsubmit="return validateData()" method="POST">
<div class="container">
<br>
<h1>Register</h1>
<p>Please fill in this form to create an account.</p>
<div class="form-group">
<label>Username</label>
<input type="text" name="username" class="form-control" id="username">
<p id="username-error" class="error-p"></p>
</div>
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" name="password" id="password">
<p id="password-error" class="error-p"></p>
</div>
<div class="form-group">
<label>Repeat Password</label>
<input type="password" class="form-control" name="confirm_password" id="confirm_password">
<p id="passwordrepeat-error" class="error-p"></p>
</div>
<br>
<button type="submit" class="btn btn-primary">Register</button>
</div>
</div>
<div class="container signin">
<p>Already have an account? <a href="login.php">Login</a>.</p>
</div>
</form>
<script>
var isvalid = false;
function validateData() {
document.getElementById("username-error").innerHTML = "";
document.getElementById("password-error").innerHTML = "";
document.getElementById("passwordrepeat-error").innerHTML = ""
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
var confirmpassword = document.getElementById("confirm_password").value;
if (username.length < 4) {
document.getElementById("username-error").innerHTML = "Username is too short!";
isvalid = false;
}
if (password.length < 7) {
document.getElementById("password-error").innerHTML = "Password is too short!";
isvalid = false;
}
if (password != confirmpassword) {
document.getElementById("passwordrepeat-error").innerHTML = "Passwords dont match!"
isvalid = false;
}
// send request to backend
let request = new XMLHttpRequest();
request.open("POST", "../DB files/usernametakenDB.php", true);
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send(`username=${username}`)
// check answer
request.onreadystatechange = () => {
if (request.readyState == 4 && request.status == 200) {
let response = JSON.parse(request.responseText);
if (response.message == 403) {
console.log("not gud");
document.getElementById("username-error").innerHTML = "Username is already taken.";
isvalid = false;
} else {
// username not yet taken
console.log("validation complete");
}
}
}
console.log(isvalid);
return isvalid;
}
</script>
出于某种原因,当我用一个已经存在的用户名测试它时,它首先返回“isvalid”变量,然后验证它是否已经存在。
我想这是因为我在request.open语句中加了“true”。但是如果我输入false,我会在控制台中得到下面的消息,而它根本不会进行验证。也不归还任何东西。
有什么问题吗?
暂无答案!
目前还没有任何答案,快来回答吧!