?
Solved

How to validate a radio button in a form

Posted on 2015-02-05
2
Medium Priority
?
174 Views
Last Modified: 2015-03-05
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
Comment
Question by:CloudHelpdeskOne
2 Comments
 
LVL 22

Assisted Solution

by:plusone3055
plusone3055 earned 750 total points
ID: 40592410
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
 
LVL 5

Accepted Solution

by:
Ronak Patel earned 750 total points
ID: 40593011
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

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
Measuring Server's processing rate with a simple powershell command. The differences in processing rate also was recorded in different use-cases, when a server in free and busy states.
The goal of the tutorial is to teach the user how to use functions in C++. The video will cover how to define functions, how to call functions and how to create functions prototypes. Microsoft Visual C++ 2010 Express will be used as a text editor an…
Viewers will learn how to properly install Eclipse with the necessary JDK, and will take a look at an introductory Java program. Download Eclipse installation zip file: Extract files from zip file: Download and install JDK 8: Open Eclipse and …
Suggested Courses

593 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question