CODEWITHSUNDEEP
javascriptvalidationradio-button
OM The Eternity
OM The Eternity

Reputation: 16184

Validating a single radio button is not working in available javascript validation script

I have randomly generated radio button series like

<input type="radio" name="creatorusers" value="1">
<input type="radio" name="creatorusers" value="1">
<input type="radio" name="creatorusers" value="1">
<input type="radio" name="creatorusers" value="1">
.....so on

But I get only ONE radio button and execute the javascript validation given for it to chk whether the radio button is selected or not, then it doesnt work Ples help me out in resolving this. 

mycreator = -1;

  for (i=frm.creatorusers.length-1; i > -1; i--) {
  if (frm.creatorusers[i].checked) {
  mycreator = i; i = -1;
  }
  }
  if (mycreator == -1) {
  alert("You must select a Creator User!");
  return false;
  }

Upvotes: 2

Views: 3893

Answers (5)

WhyGht Mic.
WhyGht Mic.

Reputation: 11

You could try something like this instead:

<html>
<head>
<script type="text/javascript">     
function confirmsubmit() {
       var btn = document.formname.buttonname

       if (btn.checked == false) 
       {
        window.alert("You did not click the button.");
        btn.focus();
        return false;
        }

        return true;
}
</script>
</head>

<body>

<form method="post" action="mailto:[email protected]" 
name="formname" onsubmit="return confirmsubmit();">
click here: <input type="radio" name="buttonname"><br />

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

</form>

</body>
</html>

Upvotes: 1

mArkO
mArkO

Reputation: 11

this should do it

function isRadioSelected(btn) {

    if(typeof btn.length === 'number') {
        for(var i=0;i<btn.length;i++)
            if(btn[i].checked) return true

    }else{
        if(btn.checked) return true
    }

    return false

}

Upvotes: 1

Sarfraz
Sarfraz

Reputation: 382606

You can do something like this:

function validate(frm){
    var isChecked = false;

    for (var i=0; i<frm.elements.length; i++)
    {
       if (frm.elements[i].type === 'radio'){
         if (frm.elements[i].checked === true){
           isChecked = true;
           break;
         }
       }
    }

    if (isChecked === true){
       return true;
    }
    else{
       alert('You should select an option first !');
    }
}

Now you should call above function on onsubmit event of the form:

<form onsubmit="return validate(this);">

Now the validate function will make sure that at least one radio button is checked otherwise it won't submit.

Upvotes: 2

Tomalak
Tomalak

Reputation: 338118

Always (!) use the var keyword. Otherwise your variables will be in the global scope (yes, even those in function bodies), which can make for some bugs that are hard to track down.

As @Felix pointed out, creatorusers will only be an array if there is more than one element with that name in the form. You can create a single-element array when necessary to work around that.

Here is an abstracted function that can validate an arbitrary checkbox list.

function ensureChecked(checkboxes, error) {
  if (checkboxes) {
    var cbx = (checkboxes.length > 0) ? checkboxes : [checkboxes]; 
    for (var i=0; i<cbx.length; i++) {
      if (cbx[i].checked) {
        return true;
      }
    }
    alert(error);
  }
  return false;
}

call as 

ensureChecked(frm.creatorusers, "You must select a Creator User!");

Upvotes: 5

Felix Kling
Felix Kling

Reputation: 816232

Ah now I got. If you only have one radio button, then frm.creatorusers is not an array. Just skip it:

var mycreator = -1;
var checked = false;

if(typeof frm.creatorusers.length === 'number') {
    for (var i=frm.creatorusers.length; i--; ) {
      if (frm.creatorusers[i].checked) {
          mycreator = i;
          checked = true;
          break;
      }
    }
}
else if(frm.creatorusers.checked){
    mycreator = //? what here?
    checked = true;
}

if(!checked) {
     alert("You must select a Creator User!");
     return false;
}

If mycreator was just for checking whether a button was selected or not, you can completely remove it from the code above.

Some further notes to your code:

  • Always declare variables with var, otherwise they will be global.
  • Use break to end a loop.
  • Maybe it is just because of copy and paste, but having a lot of radio buttons with the same value does not make much sense.

Upvotes: 3

Related Questions