The validation for the first two inputs, title and name, is functioning correctly. However, there is an issue with the page refreshing every time validation occurs.
After validating the name field, the email field, as well as other fields such as dropbox, checkbox, and message, are not being validated.
CODE
function checkData() {
if (document.signup.TITLE.value == "") {
alert("Please select your Title.")
document.signup.TITLE.focus()
return false;
}
if (document.signup.NAME.value == "" || document.signup.NAME.value.length < 2 || isNaN.document.signup.NAME.value) {
alert("Please fill in your Name.")
document.signup.NAME.focus()
return false;
}
if (document.signup.EMAIL.value == "") {
alert("Please fill in your E-Mail address.")
document.signup.EMAIL.focus()
return false;
}
if (document.signup.ENQ.value == "") {
alert("Please select your Enquiry.")
document.signup.ENQ.focus()
return false;
}
if (document.signup.INS.value == "") {
alert("Please select your Insurance.")
document.signup.INS.focus()
return false;
}
if (document.signup.MSG.value == "") {
alert("Please type in your Message.")
document.signup.MSG.focus()
return false;
} else {
return true;
}
}
<form name="signup" onsubmit="return checkData()">
<td>
Title:*
</td>
<td>
<input type="radio" name="TITLE" value="TITLE">Mr
<input type="radio" name="TITLE" value="TITLE">Mrs
<input type="radio" name="TITLE" value="TITLE">Miss
<input type="radio" name="TITLE" value="TITLE">Ms
</td>
<tr>
<td>Your Name: </td>
<td>
<input name="NAME" type="text" id="NAME" />
</td>
</tr>
<tr>
<td>E-Mail:</td>
<td>
<input name="EMAIL" type="text" id="EMAIL" />
</td>
</tr>
<!-------->
<tr>
<td>
Enquiry:*
</td>
<td>
<select>
<option name="ENQ" value="S">Select Option</option>
<option name="ENQ" value="sg">Suggestion</option>
<option name="ENQ" value="sg">Complaint</option>
<option name="ENQ" value="sg">Cancellation</option>
</select>
</div>
</div>
</td>
</tr>
<!-------->
<tr>
<td>
Select Insurance
</td>
<td>
<div id="checkboxes">
<input type="checkbox" name="INS" id="INS" value="INS" />Insurance
<label for="one"><input type="checkbox" name="INS" id="INS"/>Fees</label>
<label for="one"><input type="checkbox" name="INS" id="INS"/>Black Box</label>
</div>
</td>
</tr>
<tr>
<td>
Message:
</td>
<td>
<textarea name="MSG" rows="5" cols="80" id "MSG"></textarea>
</td>
<tr>
<tr>
<td></td>
<td>
<input type="submit" value="Email This Form">
</td>
</tr>
</form>
Access the code here: https://codepen.io/anon/pen/qwWPwq