I have a page where the users can register accounts which looks like this:
The problem is, when the user doesn't or forgot to fill up gender, it just submits the form without an error even if I have a required function on the select tag. It's only the gender that I'm having problems with. The required function works with the other fields.
here's my form:
<div class="main">
<div class="one">
<div class="register">
<center><h3>Add Account</h3></center>
<form name="reg" action="code_exec.php" onsubmit="return validateForm()" method="post">
<div>
<label>ID</label>
<input type="text" name="id" required>
</div>
<div>
<label>First Name</label>
<input type="text" name="firstname" required>
</div>
<div>
<label>Last Name</label>
<input type="text" name="lastname" required>
</div>
<div>
<label>Email</label>
<input type="text" name="email" placeholder="user@teamspan.com" required>
</div>
<div>
<label>Username</label>
<input type="text" name="username" required>
</div>
<div>
<label>Password</label>
<input type="password" name="password" required>
</div>
<div>
<label>Street Address</label>
<input type="text" name="street" required>
</div>
<div>
<label>Town/Suburb</label>
<input type="text" name="town" required>
</div>
<div>
<label>City</label>
<input type="text" name="city" required>
</div>
<div>
<label>Phone No.</label>
<input type="text" name="phone">
</div>
<div>
<label>Landline No.</label>
<input type="text" name="landline">
</div>
<div>
<label>Gender</label>
<select name="gender" required>
<option disabled selected hidden>Select Gender</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</div>
<div>
<label>User Levels</label>
<select name="user_levels" required>
<option disabled selected hidden>Select Access Level</option>
<option value="0">Employee</option>
<option value="1">Administrator</option>
<option value="2">Manager</option>
<option value="1">HR</option>
</select>
</div>
<div>
<label>Date</label>
<input type="text" readonly="readonly" name="date" value="<?php echo date("Y/m/d");?>" required>
</div>
<div>
<label>Sick Leave</label>
<input type="text" name="sickleave" required>
</div>
<div>
<label>Vacation Leave</label>
<input type="text" name="vacationleave" required>
</div>
<div>
<label>Picture (Link)</label>
<input type="text" name="picture" value="img/emp/" required>
</div>
<div>
<label></label>
<input type="submit" name="submit" value="Add Account" class="button" style="color: white;" />
<a href="hr_panel.php"><input type="button" value="Back" class="button" style="color: white;" />
</div>
</form>
</div>
</div></div>
