| <html> | |
| <head> | |
| <title>Login</title> | |
| </head> | |
| <body> | |
| <main id="main-holder"> | |
| <h1 id="login-header">Login</h1> | |
| <form id="login-form"> | |
| <input type="text" name="username" id="username-field" class="login-form-field" placeholder="Username"> | |
| <input type="password" name="password" id="password-field" class="login-form-field" placeholder="Password"> | |
| <input type="submit" value="Login" id="login-form-submit"> | |
| </form> | |
| </main> | |
| </body> | |
| <script type="text/javascript"> | |
| const loginForm = document.getElementById("login-form"); | |
| const loginButton = document.getElementById("login-form-submit"); | |
| loginButton.addEventListener("click", (e) => { | |
| e.preventDefault(); | |
| const username = loginForm.username.value; | |
| const password = loginForm.password.value; | |
| if (username === "username" && password === "password") { | |
| alert("You have successfully logged in."); | |
| } else { | |
| alert("Please enter valid credentials"); | |
| location.reload(); | |
| } | |
| }) | |
| </script> | |
| </html> |