In my code address == "" is not being checked by the If function, where I am unable to validate my form input.
if (address == "") {
document.getElementById('errormessage').style.display = "block";
window.location = '#errormessage';
return false;
}
function validateRegistration() {
var memid = document.forms["registrationForm"]["memid"].value;
var fname = document.forms["registrationForm"]["fname"].value;
var lname = document.forms["registrationForm"]["lname"].value;
var contactno = document.forms["registrationForm"]["contactno"].value;
var address = document.forms["registrationForm"]["address"].value;
var email = document.forms["registrationForm"]["email"].value;
var password = document.forms["registrationForm"]["password"].value;
var confirmpassword = document.forms["registrationForm"]["confirmpassword"].value;
console.log ("address = "+ address);
if (memid == "" || fname == "" || lname == "" || contactno == "") {
document.getElementById('errormessage').style.display = "block";
window.location = '#errormessage';
return false;
}
if (address == "") {
document.getElementById('errormessage').style.display = "block";
window.location = '#errormessage';
return false;
}
if (email == "" || password == "" || confirmpassword == "") {
document.getElementById('errormessage').style.display = "block";
window.location = '#errormessage';
return false;
}
}<div class="col-md-12">
<div id="successmessage" style="text-align: center; background-color: green; color: white; padding: 5px; font-weight: 600; display: none;">
<a href="login.php">Account Created Successfully (Click to Login)</a>
</div>
<div id="errormessage" style="text-align: center; background-color: #f56363; color: white; padding: 5px; font-weight: 600; display: none;">
<p style="margin: 0px;">Please Fill in all Required Fields</p>
</div>
<?php
if (isset($_GET['registration'])) {
$registration = $_GET['registration'];
if ($registration == 'success') {
echo '<script type="text/javascript"> document.getElementById("successmessage").style.display ="block"; </script>';
}
}
?>
<div class="company-detail new-account bg-light">
<div class="new-user-head">
<h2>Create New Account</h2>
<span class="underline left"></span>
<p>Please fill this Registration Form to Register.</p>
</div>
<form class="login" name="registrationForm" method="post" action="includes/register.inc.php" onSubmit="return validateRegistration()">
<p class="form-row form-row-first input-required">
<label>
<span class="first-letter">Student ID / Lecturer ID</span>
<span class="second-letter">*</span>
</label>
<input type="text" id="memid" name="memid" class="input-text">
</p>
<p class="form-row input-required">
<label>
<span class="first-letter">First Name</span>
<span class="second-letter">*</span>
</label>
<input type="text" id="fname" name="fname" class="input-text">
</p>
<p class="form-row input-required">
<label>
<span class="first-letter">Last Name</span>
<span class="second-letter">*</span>
</label>
<input type="text" id="lname" name="lname" class="input-text">
</p>
<p class="form-row input-required">
<span class="first-letter">Gender: </span>
<input type="radio" id="genderMale" name="gender" value="Male" class="input-text"> Male
<input type="radio" id="genderFemale" name="gender" value="Female" class="input-text"> Female
<input type="radio" id="genderNSpecified" name="gender" value="NotSpecified" class="input-text" checked> Not Specified
</p>
<p class="form-row input-required">
<label>
<span class="first-letter">Contact Number</span>
<span class="second-letter">*</span>
</label>
<input type="text" id="contactno" name="contactno" class="input-text">
</p>
<p class="form-row input-required">
<label>
<span class="first-letter">Address</span>
<span class="second-letter">*</span>
</label>
<input type="text" id="address" name="address" class="input-text">
</p>
<p class="form-row input-required">
<p id="fileName" style="display: inline;"> Choose Profile Image: </p>
<input type="file" id="imgProfile" name="imgProfile" accept="image/jpeg, image/x-png" class="input-text" style="display: inline;">
</p>
<p class="form-row input-required" style="margin-bottom: 0px;">
<label>
<span class="first-letter">Email</span>
<span class="second-letter">*</span>
</label>
<input type="email" id="email" name="email" class="input-text">
<p style="margin-top: 0px; margin-bottom: 20px; color: #f56363;">* Your Email will be your username to Login to your account.</p>
</p>
<p class="form-row input-required">
<label>
<span class="first-letter">Password</span>
<span class="second-letter">*</span>
</label>
<input type="password" id="password" name="password" class="input-text">
</p> <p class="form-row input-required" style="margin-bottom: 0px;">
<label>
<span class="first-letter">Confirm-Password</span>
<span class="second-letter">*</span>
</label>
<input type="password" id="confirmpassword" name="confirmpassword" class="input-text">
<p style="margin-top: 0px; margin-bottom: 20px; color: #f56363; display: none;">* Passwords does not match.</p>
</p>
<div class="clear"></div>
<input type="submit" value="Signup" name="submit" class="button btn btn-default">
<div class="clear"></div>
</form>
</div>
