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