stackoom
  简体   繁体   中英

How can I validate function for login form Javascript?

 原文  2019-11-04 19:39:15  5   2    javascript/ html

Question

I'm trying to make a function that validates usernames and password from local storage, and redirects the user to another HTML page. ATM, when i click my "login" button nothing happens, not even an error. Any ideas?

//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
            }
        }
    }
}

2 answers

solution1
 0  2019-11-04 19:46:41

<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>

solution2
 0  2019-11-04 20:49:15

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

Take note of the above code block.

 //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
                }
            }
        }
    }

暂无
暂无

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

Related Question How can i validate form with JavaScript How can I validate a full name input in a form using javascript? How I can validate my form with existing method written in Javascript? How can I stop a form submit and validate with javascript? How can I validate multiple fields in a form using Javascript? How can I validate an form email address with javascript? Javascript validate form OR function How can I create a function to validate an email and a username with a Javascript? how can i make a javascript based form checkbox validate with javascript before sending my form How can I detect a login form in a webpage using JavaScript?
Related Tags
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM