Comment puis-je valider la fonction pour le formulaire de connexion Javascript?

Question

J'essaie de créer une fonction qui valide les noms d'utilisateur et le mot de passe du stockage local et redirige l'utilisateur vers une autre page HTML. ATM, quand je clique sur mon bouton "login", rien ne se passe, pas même une erreur. Des idées?

//Users
class userLogin{
    constructor(username, password, authLevel){
        this.username = username;
        this.password = password;
        this.authlevel = authLevel;
    }
}
// Localstorage logins
if(localStorage.getItem("userLogin") == null){
    var userLogins = [];
    userLogins.push(new userLogin("Benjamin", 4321,"1" ));
    userLogins.push(new userLogin("Mads",12345,"1"));
    userLogins.push(new userLogin("Simon",1234,"1"));
    userLogins.push(new userLogin("Jessica", 54321,"1"));
    // Logins for Projectmanagers
    userLogins.push(new userLogin("Oliver",1234,"2"));
    userLogins.push(new userLogin("Sara",4321,"2"));

    var userLoginstring = JSON.stringify(userLogin)
    localStorage.setItem("userLogin", userLoginstring)
} else {
    var employeeList = JSON.parse(localStorage.getItem("userLogin"))

}
var uname = document.getElementById("uname");
var pass = document.getElementById("pass");

function validate() {
    var userLogins = JSON.parse(localStorage.getItem(userLogin));
    if (!userLogins) {
        userLogins = [
            //Logins for Employee
            new userLogin("Benjamin", 4321,"1" ),
            new userLogin("Mads",12345,"1"),
            new userLogin("Simon",1234,"1"),
            new userLogin("Jessica", 54321,"1"),
            // Logins for Projectmanagers
            new userLogin("Oliver",1234,"2"),
            new userLogin("Sara",4321,"2"),
        ];
        localStorage.setItem("userLogin", JSON.stringify(userLogins));

        for (let i = 0; i < userLogin.length; i++){
            if (uname.value == userLogin && pass.value == userLogin){
                alert("You have been logged in");
                document.location = "Employeesite.html";
                return false
            }
        }
    }
}

javascript html

0

Benjamin Nielsen 4 nov. 2019 à 22:39

Answer 1

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Eksamensprojekt</title>
    <link rel="stylesheet" type="text/css" href="styles.css">
</head>

<body>
<h2>Welcome to EPM!</h2>
<form id="form_id">
    <div class="image">
        <img src="EPM.png" alt="Logo" class="logo"><x></x>
    </div>
    <div class="container">
        <label for="uname"><b>Username</b></label>
        <input type="text" placeholder="Enter Username" id="uname" value="">

        <label for="pass"><b>Password</b></label>
        <input type="password" placeholder="Enter Password" id="pass" value="">

        <button type="button" value="Login" onclick="validate()">Login</button>
    </div>
</form>
</div>
<script src="Login.js"></script>
<script src="Users.js"></script>
</body>
</html>

0

Benjamin Nielsen 4 nov. 2019 à 19:46

Answer 2

if (uname.value == userLogin[i].username  && pass.value == userLogin[i].password )

Prenez note du bloc de code ci-dessus.

 //Users
    class userLogin{
        constructor(username, password, authLevel){
            this.username = username;
            this.password = password;
            this.authlevel = authLevel;
        }
    }
    // Localstorage logins
    if(localStorage.getItem("userLogin") == null){
        var userLogins = [];
        userLogins.push(new userLogin("Benjamin", 4321,"1" ));
        userLogins.push(new userLogin("Mads",12345,"1"));
        userLogins.push(new userLogin("Simon",1234,"1"));
        userLogins.push(new userLogin("Jessica", 54321,"1"));
        // Logins for Projectmanagers
        userLogins.push(new userLogin("Oliver",1234,"2"));
        userLogins.push(new userLogin("Sara",4321,"2"));

        var userLoginstring = JSON.stringify(userLogin)
        localStorage.setItem("userLogin", userLoginstring)
    } else {
        var employeeList = JSON.parse(localStorage.getItem("userLogin"))

    }
    var uname = document.getElementById("uname");
    var pass = document.getElementById("pass");

    function validate() {
        var userLogins = JSON.parse(localStorage.getItem(userLogin));
        if (!userLogins) {
            userLogins = [
                //Logins for Employee
                new userLogin("Benjamin", 4321,"1" ),
                new userLogin("Mads",12345,"1"),
                new userLogin("Simon",1234,"1"),
                new userLogin("Jessica", 54321,"1"),
                // Logins for Projectmanagers
                new userLogin("Oliver",1234,"2"),
                new userLogin("Sara",4321,"2"),
            ];
            localStorage.setItem("userLogin", JSON.stringify(userLogins));

            for (let i = 0; i < userLogin.length; i++){
                if (uname.value == userLogin[i].username  && pass.value == userLogin[i].password ){
                    alert("You have been logged in");
                    document.location = "Employeesite.html";
                    return false
                }
            }
        }
    }

0

Ifesinachi Bryan 4 nov. 2019 à 20:49

Comment puis-je valider la fonction pour le formulaire de connexion Javascript?

2 réponses

De nouvelles questions