Validate Radio Button

muthamizh · September 14, 2017

Dear All,

I have been learning JS recently.
i am trying to wirte code for Form Validation:
For form Validation I am using Radio buttons for Gender: Its working but i can able to select both Options there is no Validation
Code:

             if ( ( document.getElementById('gender1').checked ==false ) && ( document.getElementById('gender2').checked ==false) ) 
               { alert("please select any on of them");
                  return false;
               }

Could you anyone help me to find out. If possible please reply with Code.

<html>
<head>
    <title>form validation</title>
<script LANGUAGE="JavaScript">
function validate()
{
			if(document.getElementById('fname').value =='')
			{
				alert("please enter firstname");
				document.getElementById('fname').focus();
				return false;
			}

                         if(document.getElementById('lname').value =='')
			{
				alert("please enter last name");
				document.getElementById('lname').focus();
				return false;
			}
                        if(document.getElementById('age').value =='')
			{
				alert("please enter age");
				document.getElementById('age').focus();
				return false;
			}

                       if ( ( document.getElementById('gender1').checked ==false ) && ( document.getElementById('gender2').checked ==false) )
			{

				alert("please selece any on of them");
				document.getElementById('gender1').focus();
				return false;
			}
			if(document.getElementById('email').value =='')
			{
				alert("please enter email");
				document.getElementById('email').focus();
				return false;
			}
			if(document.getElementById('uid').value =='')
			{
				alert("please enter Userid");
				document.getElementById('uid').focus();
				return false;
			}
			if(document.getElementById('password').value =='')
			{
				alert("please enter password");
				document.getElementById('password').focus();
				return false;
			}

if(document.getElementById('confirm').value =='')
			{
				alert("please enter password");
				document.getElementById('confirm').focus();
				return false;
			}
else
{
	alert("thanks");
}
}

</script>
	</head>
	<body >
<center>
	<table id="table1">
	<tr>
	<td>First Name:</td>
	<td><input type="text" id="fname" name="fname"  /></td>
		</tr>
	<tr>
	<td>Last Name:</td>

	<td><input type="text" id="lname" name="lname" /></td>

		</tr>
<tr>
	<td>Age:</td>
	<td><input type="text" id="age" name="age" /></td>
	</tr>
<tr>
	<td>Gender:</td>
	<td><input type="radio" id="gender1" name="gender1" value="M"  />Male</td>
	<td><input type="radio" id="gender2" name="gender2" value="F" />FeMale</td>
	</tr>
	<tr>
	<td>Email:</td>
	<td><input type="text" id="email" name="email" /></td>
	</tr>
	<tr>
	<td>User Id:</td>
	<td><input type="text" id="uid" name="uid" /></td>
	</tr>
	<tr>
	<td>Password:</td>
	<td><input type="password" id="password" name="password" /></td>
		</tr>
	<tr>
	<td>Confirm Password:</td>
	<td><input type="password" id="confirm" name="confirm" /></td>
		</tr>
	<tr>
	<td><input type="button" id="button" value="Submit" onclick="validate()";finalValidate();"/></td>
	</tr>
	</table>
	</center>
	</body>
	</html>

Regards,

Muthamizh.T

Tell me the exact code to validate the radio Buttons using with the above code
Could you Please anyone help me to get a solution:

mattstyles · September 19, 2017

I'm not going to show you the exact changes you need to make, sounds like this is for an evaluation and you need to actually dig in and learn independently if you want to make any headway as a programmer.

MDN should still be your first stop for small problems like this and to check syntax etc etc, for example, if you had googled 'MDN radio button', you would have ended up https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio.

Having said I'm not giving you the exact code, it is actually in that link, I'm sure you'd find ~1 million other blog posts outlining almost the exact code you need. Asking questions of a community is great, but sometimes you'll find it more rewarding to find the answers on your own and experiment to find the best way of doing things.

To make your code work you just have to delete 2 little characters.

Sign In

Validate Radio Button

Recommended Posts

muthamizh

Link to comment

Share on other sites

mattstyles

Link to comment

Share on other sites

Join the conversation

Recently Browsing 0 members

Browse

Activity