Sign in to follow this  
muthamizh

Validate Radio Button

Recommended Posts

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: 

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.