如何在表单验证中使用数据库数据？

Question

Hi I have a form that using database to validation, Now validation just working for latest database data, What should i do to validate for each of data.

DB information

demo-form.php

<form name="login1" action="demo-login.php" onsubmit="return validateForm1()" method="post" id="form1">
<p>user name: <input type="text" name="luser" id="luser"/></p>
<p>password: <input type="password" name="lpass" id="lpass" /></p>
<input type="submit" value="login" name="submit"/>
</form>

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "users";

$conn2 = new mysqli($servername, $username, $password, $dbname);

if ($conn2->connect_error) {
     die("Connection failed: " . $conn2->connect_error);
} 


$sql2 = "SELECT * FROM users";
$result2 = $conn2->query($sql2);

if ($result2->num_rows > 0) {

     while($row = $result2->fetch_assoc()) {
         $luser = $row["user"];
         $lpass = $row["pass"];
     }
} else {
echo "err_2";
}

$conn2->close();
?> 

<script>
function validateForm1(){
var luser = document.getElementById("luser").value;
var lpass = document.getElementById("lpass").value;
        if (luser == "" || lpass == ""){
            document.getElementById("luser").placeholder="Fill, it's necessary";
            document.getElementById("lpass").placeholder="Fill, it's necessary";
            return false;
        }
        if (luser !== "<?php echo $luser; ?>" || lpass !== "<?php echo $lpass; ?>"){
            alert("user or pass is not true");
            return false;
        }
}
</script>

Answer 1

It looks like you are using the IDs "luser" and "lpass" multiple times. You cannot allocate markup IDs multiple times. Use classes instead and select with those.

See getElementsByClassName

Answer 2

I Found my answer that using php ajax. i hope it helps to other people.

demo-form.php

<form name="login1" action="demo-login.php" onsubmit="return validateForm1()" method="post" id="form1">
<p>user name: <input type="text" name="luser" id="luser" onmouseleave="showUser(this.value)" onchange="showUser(this.value)"/></p>
<p>password: <input type="password" name="lpass" id="lpass" /></p>
<input type="submit" value="login" name="submit"/>
</form>
<div id="passh"></div>


<script>
function validateForm1(){
var luser = document.getElementById("luser").value;
var lpass = document.getElementById("lpass").value;
    if (luser == "" || lpass == ""){
        document.getElementById("luser").placeholder="Fill, it's necessary";
        document.getElementById("lpass").placeholder="Fill, it's necessary";
        return false;
    }
    if (lpass !== document.getElementById("passh").value){
        alert("user or pass is not true");
        return false;
    }
}

function showUser(str) {
    if (str == "") {
        document.getElementById("lpass").placeholder="";
        return;
    } else { 
        if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
        } else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
    document.getElementById("passh").value = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","loginpass.php?q="+str,true);
        xmlhttp.send();
    }
}
</script>

loginpass.php

<?php
$q = $_GET['q'];

$con = mysqli_connect('localhost','root','','users');
if (!$con) {
    die('Could not connect: ' . mysqli_error($con));
}

mysqli_select_db($con,"ajax_demo");
$sql="SELECT * FROM users WHERE user = '". $q ."' ";
$result = mysqli_query($con,$sql);

while($row = mysqli_fetch_array($result)) {
    echo  $row['pass'] ;
}

mysqli_close($con);
?>