JavaScript function not working for validation I have created one servlet , servlet is working fine but just function validation is not working.
Created 7 labels using html but javascript function is not working i need to validate the field from user end which i have to display the message for user if user ignore some field .
`<!DOCTYPE html>
<html>
<head>
<title>Registration</title>
<style>
a {
text-decoration: none;
}
.login-page
{
width: 100%;
height: 100vh;
display: inline-block;
display: flex;
align-items: center;
}
.form-right i
{
font-size: 100px;
}
</style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#">PC</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">About</a>
</li>
</ul>
<form class="d-flex" action="login.html">
<button class="btn btn-outline-success" type="submit">Login</button>
</form>
</div>
</div>
</nav>
<br><br><br><br><br>
<div class="login-page bg-light">
<div class="container">
<div class="row">
<div class="col-lg-10 offset-lg-1">
<h3 class="mb-3">Register</h3>
<div class="bg-white shadow rounded">
<div class="row">
<div class="col-md-7 pe-0">
<div class="form-left h-100 py-5 px-5">
<form action="Registration" method="post" onsubmit="return register_form_validation()" class="row g-4" >
<div class="col-12">
<label>Username<span class="text-danger">*</span></label>
<div class="input-group">
<div class="input-group-text"><i class="bi bi-person-fill"></i></div>
<input type="text" class="form-control" placeholder="Enter Username" name="uname">
</div>
</div>
<div class="col-12">
<label>Password<span class="text-danger">*</span></label>
<div class="input-group">
<div class="input-group-text"><i class="bi bi-lock-fill"></i></div>
<input type="password" class="form-control" placeholder="Enter Password" name="pwd">
</div>
</div>
<div class="col-12">
<label>First Name<span class="text-danger">*</span></label>
<div class="input-group">
<input type="text" class="form-control" placeholder="Enter First name" name="fname">
</div>
</div>
<div class="col-12">
<label>Middle Name<span class="text-danger">*</span></label>
<div class="input-group">
<input type="text" class="form-control" placeholder="Enter Middle name" name="mname">
</div>
</div>
<div class="col-12">
<label>Last Name<span class="text-danger">*</span></label>
<div class="input-group">
<input type="text" class="form-control" placeholder="Enter Last name" name="lname">
</div>
</div>
<div class="col-12">
<label>Email<span class="text-danger">*</span></label>
<div class="input-group">
<input type="text" class="form-control" placeholder="Enter Email Address" name="email">
</div>
</div>
<div class="col-12">
<label>Mobile Number<span class="text-danger">*</span></label>
<div class="input-group">
<input type="number" class="form-control" placeholder="Enter Mobile Number" name="mobile">
</div>
</div>
<div class="col-sm-6">
<div>
<button type="submit" class="btn btn-primary px-4 float-end mt-4">Register</button>
</div>
</div>
</form>
</div>
</div>
<div class="col-md-5 ps-0 d-none d-md-block">
<div class="form-right h-100 bg-primary text-white text-center pt-5">
<i class="bi bi-book-half"></i>
<h2 class="fs-1">Welcome to PC bookshop!!!</h2>
</div>
</div>
</div>
</div>
<p class="text-end text-secondary mt-3"></p>
</div>
</div>
</div>
</div>
<script>
function register_form_validation()
{
var uname=document.getElementById("uname").value;
var pwd=document.getElementById("pwd").value;
var email=document.getElementById("email").value;
var fname=document.getElementById("fname").value;
var mname=document.getElementById("mname").value;
var lname=document.getElementById("lname").value;
var mobile=document.getElementById("mobile").value;
if(uname=='')
{
alert('Please enter Username');
return false;
}
else if(pwd=='')
{
alert('Please enter Email');
return false;
}
else if(email=='')
{
alert('Please enter password');
return false;
}
else if(fname=='')
{
alert('Please enter fname');
return false;
}
else if(mname=='')
{
alert('Please enter mname');
return false;
}
else if(lname=='')
{
alert('Please enter lname');
return false;
}
else if(mobile=='')
{
alert('Please enter mobile');
return false;
}
else
{
return true;
}
return false;
}
</script>
</body>
</html>`