Question posted in 
<!doctype html>
</html>
<head>
<title> </title>
<link href="../assets/css/bootstrap.css" rel="stylesheet">
<link href="sigin-style.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>
<body>
<div class="container-fluid px-1 px-md-5 px-lg-1 px-xl-5 py-5 mx-auto">
<div class="card card0 border-0">
<div class="row d-flex">
<div class="col-lg-6">
<div class="card1 pb-5">
<div class="row"> </div>
<div class="row px-3 justify-content-center mt-4 mb-5 border-line"> <img
src="https://i.imgur.com/uNGdWHi.png" class="image"> </div>
</div>
</div>
<div class="col-lg-6">
<div class="card2 card border-0 px-4 py-5" name = "login">
<div class="row mb-4 px-3"> <!-- fb twitter linked login-->
<h6 class="mb-0 mr-4 mt-2">Sign in with</h6>
<div class="facebook text-center mr-3">
<div class="fa fa-facebook"></div>
</div>
<div class="twitter text-center mr-3">
<div class="fa fa-twitter"></div>
</div>
<div class="linkedin text-center mr-3">
<div class="fa fa-linkedin"></div>
</div>
</div>
<div class="row px-3 mb-4"> <!-- OR login separator line-->
<div class="line"></div> <small class="or text-center">Or</small>
<div class="line"></div>
</div>
<div class="row px-3" > <!-- email address-->
<label class="mb-1">
<h6 class="mb-0 text-sm">Email Address</h6>
</label>
<input class="mb-4" type="text" name="email" placeholder="Enter a valid email address">
</div>
<div class="row px-3"> <label class="mb-1"> <!-- passowrd-->
<h6 class="mb-0 text-sm">Password</h6>
</label>
<input type="password" name="password" placeholder="Enter password">
</div>
<div class="row px-3 mb-4"> <!-- remember me checkbox and forgot password link-->
<div class="custom-control custom-checkbox custom-control-inline"> <!--remember me-->
<input id="chk1"
type="checkbox" name="chk" class="custom-control-input">
<label for="chk1" class="custom-control-label text-sm">Remember me</label>
</div>
<a href="#" class="ml-auto mb-0 text-sm">Forgot Password?</a> <!--fogot password-->
</div>
<div class="row mb-3 px-3"> <!--login button-->
<button type="submit" class="btn btn-blue text-center" onclick="validate()" >Login</button>
</div>
<div class="row mb-4 px-3"><!-- register link-->
<small class="font-weight-bold">Don't have an account?
<a href="E:/WebDevStudy/html-css/bootstrap%20webpage%20example/register.html"
class="text-danger "> Register
</a>
</small>
</div>
</div>
</div>
</div>
<div class="bg-blue py-4">
<div class="row px-3"> <small class="ml-4 ml-sm-5 mb-2">Copyright © 2019. All rights
reserved.</small>
<div class="social-contact ml-4 ml-sm-auto"> <span class="fa fa-facebook mr-4 text-sm"></span> <span
class="fa fa-google-plus mr-4 text-sm"></span> <span
class="fa fa-linkedin mr-4 text-sm"></span> <span
class="fa fa-twitter mr-4 mr-sm-5 text-sm"></span> </div>
</div>
</div>
</div>
</div>
</body>
<script>
function validate()
{
var em = document.login.email.value;
var pw = document.login.password.value;
console.log(em);
var valid = false;
var usernameArray = ["ashish", "rahul"];
var passwordArray = ["12345", "54321"];
for (var i = 0; i < usernameArray.length; i++)
{
if ((un == usernameArray[i]) && (pw == passwordArray[i]))
{
valid = true;
break;
}
}
if (valid)
{
alert("Login was successful");
window.location = "www.google.ie";
return false;
}
else
{
alert("Incorrect password or username you are now blocked");
return false;
}
}
</script>
</html>
The above code is intended to be for a simple html login page where user will enter their email and password to login by clicking login button. the script for doing so is added at the end of the document following body tag. for some reason it is unable to fetch the email and password fields’ values and match it with the array i have implemented. kindly point out my fault.
3
Answers
You need to place your inputs within a form to get values the way you want.
Look:
form tags are missing in your code; submit button and input fields should be within form tags
Can you work with this? I tested it and it works.
I changed your
to
and gave your email and password inputs an id