• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 180
  • Last Modified:

How to validate a radio button in a form

I'm trying to validate a form with Javascript. I dit it with a select field and it works good but need help to validate with a radio buttom.

This my code:

## JAVASCRIPT ##

<script type="text/javascript">

  function checkForm(form)
  {

    var selectCivilStatus = form.select_1.options[form.select_1.selectedIndex].value;


    if(selectCivilStatus == "") {
        alert("Error: Marital Status is not selected");
        form.select_1.focus();
        return false;
    }

  }

</script>


## HTML ##


Civil Status:

<select size="1" name="select_1">
<option VALUE="">SELECT</option>
<option VALUE="Single">Single</option>
<option VALUE="Married">Married</option>
<option VALUE="Divorced">Divorced</option>
</select>

I need to validate this one with JavaScript too:

Bonus Payment:

<input type="radio" name="radio_1" value="Yes"> Yes
<input type="radio" name="radio_1" value="No"> No

##########

Please help. Thank you so much!
0
CloudHelpdeskOne
Asked:
CloudHelpdeskOne
2 Solutions
 
plusone3055Commented:
I think a more rewarding experience is to learn through examples :)

here is a perfect example that will show you how to validate radio buttons and you can then incorporate it into your code :)

http://www.esqsoft.com/javascript/javascript-example-how-to-validate-radio-buttons.htm
0
 
Ronak PatelCommented:
try below code:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<script type="text/javascript">
		function checkForm(form)
		{
			var selectCivilStatus = form.select_1.options[form.select_1.selectedIndex].value;

			if(selectCivilStatus == "")
			{
				alert("Error: Marital Status is not selected");
				form.select_1.focus();
				return false;
			}

			if (!form.bonusPayment_Yes.checked && !form.bonusPayment_No.checked)
			{
				alert("Error: Bonus Payment is not selected");
				return false;
			}
		}
	</script>
</head>
<body>
<form name="Form1" id="Form1">
Civil Status:
<select size="1" name="select_1">
<option VALUE="">SELECT</option>
<option VALUE="Single">Single</option>
<option VALUE="Married">Married</option>
<option VALUE="Divorced">Divorced</option>
</select>

Bonus Payment:

<input type="radio" id="bonusPayment_Yes" name="radio_1" value="Yes"> Yes
<input type="radio" id="bonusPayment_No" name="radio_1" value="No"> No

<input type="submit" value="Submit" onclick="checkForm(document.forms['Form1']);" />
</form>
</body>
</html>

Open in new window


Hope this helps.

Regards,
Ronak
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now