JavaScript - Validating radio buttons

Asked By TK Neva

07-Feb-09 02:41 AM

I am currently making an online questionnaire and I need to validate whether or not all 5 of my radio button lists have a selected value. If they all have a selection, then I want to enable a submit button.

I can do it, but with my code the radio button lists must be selected in chronologicial order. I am referring to my buttons as components of a form ( i.e. df[2] is the third item in the form).

I need the submit button to be enabled when all radio button lists have a selected value, but in any order the user decides to answer each question.

I am really struggling. I appreciate all of the help in the past, present, and future.

Thanks.

THIS IS SAME EXAMPLE AS YOU WANT TO DO

07-Feb-09 03:53 AM

A friend recently asked for a code sample showing JavaScript being used to client-side validate the radio inputs of an HTML form. This example took about 15 minutes to build and tweak to her specifications. The techniques used here are very rudimentary, but effective nonetheless. If you have suggestions for other approaches, or additional questions related to this example, be sure to email me. Best wishes!

function validateRadio(obj,correct){ var result = 0 for(var i=0; i Choose "3" 1 2 3 4
Choose "2" 1 2 3 4

POSTING SAME AGAIN WITH RIGHT FORMAT

07-Feb-09 03:57 AM

<script type="text/javascript">

function validateRadio(obj,correct){

  var result = 0

  for(var i=0; i<obj.length; i++){

    if(obj[i].checked==true && obj[i].value==correct) result = 1

  if(!result && obj.value == correct) result = 1

  return result

</script>

<form onsubmit="  var err = ''

  if(!validateRadio(this.a,3)){ err+='\nFirst radio is wrong' }

  if(!validateRadio(this.b,2)){ err+='\nSecond radio is wrong' }

  if(err.length){ alert('Problem:'+err); return false; }

  else{ alert('Good Job -- Submitting'); return true; }" action="#">

Choose "3"

<input name="a" value="1" onchange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio"> 1

<input name="a" value="2" onchange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio"> 2

<input name="a" value="3" onchange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio"> 3

<input name="a" value="4" onchange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio"> 4

<p>Choose "2"

<input name="b" value="1" type="radio"> 1

<input name="b" value="2" type="radio"> 2

<input name="b" value="3" type="radio"> 3

<input name="b" value="4" type="radio"> 4

</p><p><input value="Submit" type="submit">

</p></form>

TRY THIS

07-Feb-09 04:00 AM

function checkForm(isForm,btnID){

nradio = 0;
ok = false;
for (n=0; n<isForm.length; n++)
{
if (isForm[n].type == 'radio'){nradio++}
}
for (i=0; i<nradio; i++)
{
if(isForm.button[i].checked == true){ok = true}
}
if (ok == false){alert('Please make a selection')};
else {document.getElementById(btnID).disabled = true}

}

</Script>
</Head>
<body>
<form name='demoForm'>
Larry: <input type="radio" name="button" value="larry"><br>
Moe: <input type="radio" name="button" value="moe"><br>
Curly: <input type="radio" name="button" value="curly"><br>
<input type="button" id='submit1' value="Submit" onClick="checkForm(demoForm,'submit1')">
</form>
</body>
</html>

TRY THIS LINK

07-Feb-09 04:00 AM

http://www.felgall.com/javatip2.htm

http://www.esqsoft.com/javascript/javascript-example-how-to-validate-radio-buttons.htm

Panji Tengkorak replied to TK Neva

07-Feb-09 07:45 PM

I am assuming you have groups of radio buttons there and you want the submit button to be enabled when each group has a radio button checked. I think all you need to do is to create a function to validate each group to check whether each group has a checked radio button or not and you need to call the function on every click of the radio buttons. Here is the HTML code to demonstrate it:

<html>
   <head>
      <script language="javascript">
          function validateRB() {
             RBGroup1 = document.forms.frmRadioNM.R1;
             RBGroup2 = document.forms.frmRadioNM.R2;
             R1Valid = false;
             R2Valid = false;

             for(i=0; i<RBGroup1.length; i++){
                 if(RBGroup1[i].checked==true) {
                    R1Valid = true;
                 }
             }

             for(i=0; i<RBGroup2.length; i++){
                 if(RBGroup2[i].checked==true) {
                    R2Valid = true;
                 }
             }

             if(R1Valid && R2Valid) {
                document.forms.frmRadioNM.btnSubmit.disabled=false;
             }
             else {
                document.forms.frmRadioNM.btnSubmit.disabled=true;
             }
          }
      </script>
   </head>
   <body>
       <form name="frmRadioNM" id="frmRadioID">
           <input type="radio" value="R1V1" name="R1" onclick="validateRB();">
           <input type="radio" value="R1V2" name="R1" onclick="validateRB();">
           <input type="radio" value="R1V3" name="R1" onclick="validateRB();">
           <br>
           <input type="radio" value="R2V1" name="R2" onclick="validateRB();">
           <input type="radio" value="R2V2" name="R2" onclick="validateRB();">
           <input type="radio" value="R2V3" name="R2" onclick="validateRB();">
           <br>
           <input type="submit" name="btnSubmit" value="SUBMIT" disabled>
       </form>
   </body>
</html>
_______________

Daniel

javascript validation for radiobutton and checkbox

javascript validation for radiobutton and checkbox hi anyone pls give the code for javascript validation in radio button to select any one of the list item.the radiobuttonis present in gridview the examples http: / / www.programmersheaven.com / mb / java-script / 291842 / 291842 / how-do-i-validate-a-radio-button-and-checkbox / http: / / codeidol.com / javascript / learning-javascript / Forms-and-JiT-Validation / Radio-Buttons-and-Checkboxes / http: / / www.just-stuart.com / geeks / my_fixes / javascript_form_validation_checkbox_radio.php / * For RadioButton Validation false)) { alert("Please Tick the desired option"); form1.option1[0].focus(); return false; } } hi, avascript radio buttons validation Suppose you have a radio button in your form and you want the

Validation to choose at least one in radiobuttons and checkedlistbox Untitled document

you can put another for checkboxlist control Also you can put client side validation in javascript function for both control must be selected at least one. http: / / weblogs.asp.net / mikebosch You must check at least one item." ); return ; } / / do whatever you need to do ' } hi. . Javascript radio buttons validation Suppose you have a radio button in your form and you want the useres to select atleast one option. You can do this by using javascript radio button validation script.See the example below. Your Gender: Male Female Put the following piece of javascript in your function function ValidateForm(form) if ( ( form.gender[0].checked = = false ) && ( form.gender[1 Please choose your Gender: Male or Female" ); return false; } Try the following code: <script LANGUAGE = "JavaScript"> <!- - function ValidateForm(form){ ErrorText = ""; if ( ( form.gender[0].checked = = false ) && ( form.gender[1].checked = = false

Radio button list

Radio button list Hi I have a Radio button list in my page . After placing that i have placed some other controls. I need javascript for the radio button list while the user doesn't select any one option in radio button list , i need to show one alert messgae like please select any option in radio button list. How can i do this. Cheers, Samantha. Use this client side function- function getElementById ('<% = boxid.ClientID %> '). disabled = True ; } } } This this code and let me know. < script type = "text / javascript"> function checkSelection () { var listItemArray = document.getElementsByName( ' <% = RadioButtonList1.ClientID %> ' ); var isItemChecked = false ; / / Radio check for ( var i = 0; i < listItemArray.length; i++) { var listItem = listItemArray[i]; if (listItem

i want code for validation controlsin java script

take place - in this example the form will contain: • input boxes for text and numbers • radio buttons • a drop-down (or combo) box • a button to submit the form <form name of an Ajax Application • How to Turn any Web Page Object into an Anchor • Creating Javascript Bookmarklets <table> <tr> <td> Title<br / > <select name = title> <option> Please choose. . .< / option> <option> Mr tr> <tr> <td> Age<br / > <input name = age> < / td> <td> Gender<br / > Male<input type = radio name = gender value = 1> Female<input type = radio name = gender value = 2> < / td> < / tr> <tr> <td> Password<br / > <input name = pwd type = password td> < / tr> <tr> <td colspan = 2 align = center> <input type = button onclick = "javascript: checkFormContents();" value = "Send Data"> < / td> <tr> < / table> < / form> There are two important things to note userdata ) • instead of using a submit button the form has a button to call a Javascript function - this function will validate the form and then sent the data to the target functions that will carry out the form validation. The First Step towards Form Validation with Javascript Before jumping in a a full data validating script it's worth starting with simpler script; one that does no validation and only