Why doesn't the highlighted part of the JavaScript work?
Posted
by
Dor Cohen
on Stack Overflow
See other posts from Stack Overflow
or by Dor Cohen
Published on 2012-10-23T22:51:55Z
Indexed on
2012/10/23
23:00 UTC
Read the original article
Hit count: 327
Filed under:
JavaScript
|getelementbyid
Why isn't the 'confirm password and password the same' part working? Meaning, the part that uses the 'getElementById' to adress the password and confirmpassword. Every part works but that particular part. It doesn't show a red box around the text fields. Can anyone help me?
<html>
<head>
</head>
<script>
function submitinfo()
{
var firstname = document.getElementById("firstname").value;
var lastname = document.getElementById("lastname").value;
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
var confirmpassword = document.getElementById("confirmpassword").value;
var email = document.getElementById("email").value;
if(firstname !== "" && document.getElementById("firstname").style.borderColor == "red")
{
document.getElementById("firstname").style.border = "none"
}
if(lastname !== "" && document.getElementById("lastname").style.borderColor == "red")
{
document.getElementById("lastname").style.border = "none"
}
if(username !== "" && document.getElementById("username").style.borderColor == "red")
{
document.getElementById("username").style.border = "none"
}
if(password !== "" && document.getElementById("password").style.borderColor == "red")
{
document.getElementById("password").style.border = "none"
}
if(confirmpassword !== "" && document.getElementById("confirmpassword").style.borderColor == "red")
{
document.getElementById("confirmpassword").style.border = "none"
}
if(email !== "" && document.getElementById("email").style.borderColor == "red")
{
document.getElementById("email").style.border = "none"
}
if(firstname == "")
{
document.getElementById("firstname").style.borderColor = "red";
document.getElementById("firstname").style.borderStyle = "solid";
}
if(lastname == "")
{
document.getElementById("lastname").style.borderColor = "red";
document.getElementById("lastname").style.borderStyle = "solid";
}
if(username == "")
{
document.getElementById("username").style.borderColor = "red";
document.getElementById("username").style.borderStyle = "solid";
}
if(password == "")
{
document.getElementById("password").style.borderColor = "red";
document.getElementById("password").style.borderStyle = "solid";
}
if(confirmpassword == "")
{
document.getElementById("confirmpassword").style.borderColor = "red";
document.getElementById("confirmpassword").style.borderStyle = "solid";
}
if(email == "")
{
document.getElementById("email").style.borderColor = "red";
document.getElementById("email").style.borderStyle = "solid";
}
if(password !== "" && confirmpassword !== "" && document.getElementById("password").style.border == "none" && document.getElementById("confirmpassword").style.border == "none" && password !== confirmpassword) { document.getElementById("password").style.border = "red"; document.getElementById("confirmpassword").style.border = "red"; }
if(firstname && lastname && username && password && confirmpassword && email !== "")
{
window.open()
}
}
</script>
<h><font size=4 color=3BCCBE><b>Full Name</b></font><h/>
<br>
<input type="text" id="firstname" size="15px" placeholder="First">
<input type="text" id="lastname" size="15px" placeholder="Last">
<br> <br> <br> <br>
<h><font size=4 color=3BCCBE><b>Choose your username</b></font></h>
<br>
<input type="text" id="username" size="37px">
<br>
<p><font size=3 color="grey">atleast 6 characters long</font></p>
<br>
<h><font size=4 color=3BCCBE><b>Create a password</b></font></h>
<br>
<input type="password" id="password" size="37px">
<br> <br> <br> <br>
<h><font size=4 color=3BCCBE><b>Confirm your password</b></font><h/>
<br>
<input type="password" id="confirmpassword" size="37px">
<br> <br> <br> <br>
<h><font size=4 color=3BCCBE><b>Email address</b></font><h/>
<br>
<input type="text" id="email" size="37px">
<br> <br> <br> <br>
<input type="button" value="Submit" onclick="submitinfo()" style="height:50px; width:85px; font-size:22px;>
<br>
</body>
</html>
© Stack Overflow or respective owner
