Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Javascript validation with html radiobuttons

Status
Not open for further replies.

aselden

Programmer
Feb 27, 2012
4
SE
Hello! I was hoping someone would be able to give me some pointers with a problem of mine.

My code does not return true even when the the correct radiobutton is checked. Any help is appreciated!


<html>
<head>
<script type="text/javascript">
function validateForm()
{
var e=document.forms["myForm"]["guardiansPermission"].value;
if (e==null || e=="" || e==0)
{
alert("Permission must be given.");
return false;
}
</script>
</head>

<body>
<form name="myForm" action="form.asp" onsubmit="return validateForm()" method="post">
<input type='radio' name='guardiansPermission' value='1'> Yes
<input type='radio' name='guardiansPermission' value='0' checked> No
<input type="submit" value="Submit">
</form>
</body>

</html>
 
Assuming the missing curly brace "}" that should close your function is not actually missing in your real code, the problem is that you are treating your radio buttons as a single element.

To Javascript two or more Radio buttons with the same name will be treated as an array. So you want to check either that the first radio button is checked or that the second radio button is unchecked.

Code:
var e=dcument.forms["myForm"]["guardiansPermission"];
if (e[0].checked!=true)
  {
  alert("Permission must be given.");
  return false;
  }



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Thank you for the help Vacunita, unfortionatly i still cannot get this to work, after applying your code it still jumps straight to the form's action.

Must i fetch the radiobuttons as an array or something like that?Been working this for a while now so any pointers are welcome!

Quite new to javascript to be honest!
 
Hi

It works for me after correcting the obvious typo. Did you corrected it ?
Code:
[b]var[/b] e[teal]=[/teal]d[highlight]o[/highlight]cument[teal].[/teal]forms[teal][[/teal][green][i]"myForm"[/i][/green][teal]][[/teal][green][i]"guardiansPermission"[/i][/green][teal]];[/teal]
If still not works, post your modified code.

Next time please post your code between [tt][ignore]
Code:
[/ignore][/tt] and [tt][ignore]
[/ignore][/tt] TGML tags.

Feherke.
 
Solved my problem! Thank you for the help!

For others with the same problem:

<code>
<html>
<head>
<script type="text/javascript">
function validateForm()
{
if(document.getElementById('test').checked!=true) {
alert("Permission must be given.");
return false;
}
}
</script>
</head>

<body>
<form name="myForm" action="form.asp" onsubmit="return validateForm()" method="post">
<input type='radio' name='guardiansPermission' id='test' value='1'> Yes
<input type='radio' name='guardiansPermission' id='two' value='0' checked> No
<input type="submit" value="Submit">
</form>
</body>

</html>
</code>
 
Yes, i corrected that part, and whops. Used to html tags!
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top