javascript - How to dynamically check radio buttons with one or multiple -


i have case radio button groups generated dynamically in form.

requirements:

  • the number of buttons per group 1 or many.
  • there function checks whether radio button selection has been made , alerts error if no selection made.

when there 1 radio button check fails , alerts error, when button selected. when log (or in case alert) form element different object type single group or multiple group: htmlinputelement vs radionodelist. since check function checkkrb() iterates through list , htmlinputelement returns length of undefined, in single button group selection not caught.

why object types different? why not radionodelist of length 1 single radio button?

how can check variety of radio button groups when number of buttons unknown?

here stripped down example:

html

<form action="">    <!-- single radio button -->   <label for="single">single</label>   <input type="radio" id="single" name="offering" value="single" checked>    <!-- multiple radio buttons -->   <p>multiple</p>   <label><input type="radio" id="yes" name="choices" value="yes"> yes </label>   <label><input type="radio" id="no" name="choices" value="no"> no </label>    <div>&nbsp;</div>   <input type="submit" id="submit" name="submit" value="continue" onclick="return checkform(this.form)">  </form> 

js

function checkrb(rb){   var error = '';   var flag = 0;   var itschecked = 0    alert(rb);    (var = 0; < rb.length; i++){     if (rb[i].checked){       itschecked = 1;     }    }    if (itschecked == 0){     error = error + "error message \r\r";     flag = 1;   }    return {flag: flag, error: error}; }  function checkform(form){   var error = '';   var flag = 0;    var cksingle = checkrb(form.offering);   if (cksingle.flag == 1){     flag = 1;   }   error += cksingle.error;    var ckmultiple = checkrb(form.choices);   if (ckmultiple.flag == 1){     flag = 1;   }   error += ckmultiple.error;    // alert error if selection not made   if (flag == 1){     alert(error);     return false;   }   return true; } 

would updating script option?

by check if objects length countable before using avoid error on non array object.

  if (rb.length > 0) {     (var = 0; < rb.length; i++) {       if (rb[i].checked) {         itschecked = 1;       }     }   } else {     if (rb.checked) {       itschecked = 1;     }   } 

sample snippet

function checkrb(rb) {    var error = '';    var flag = 0;    var itschecked = 0      if (rb.length > 0) {      (var = 0; < rb.length; i++) {        if (rb[i].checked) {          itschecked = 1;        }      }    } else {      if (rb.checked) {        itschecked = 1;      }    }        if (itschecked == 0) {      error = error + "error message \r\r";      flag = 1;    }      return {      flag: flag,      error: error    };  }    function checkform(form) {    var error = '';    var flag = 0;      var cksingle = checkrb(form.offering);    if (cksingle.flag == 1) {      flag = 1;    }    error += cksingle.error;      var ckmultiple = checkrb(form.choices);    if (ckmultiple.flag == 1) {      flag = 1;    }    error += ckmultiple.error;      // alert error if selection not made    if (flag == 1) {      alert(error);      return false;    }    return true;  }
<form action="">      <!-- single radio button -->    <label for="single">single</label>    <input type="radio" id="single" name="offering" value="single" checked>      <!-- multiple radio buttons -->    <p>multiple</p>    <label>      <input type="radio" id="yes" name="choices" value="yes">yes</label>    <label>      <input type="radio" id="no" name="choices" value="no">no</label>      <div>&nbsp;</div>    <input type="submit" id="submit" name="submit" value="continue" onclick="return checkform(this.form)">    </form>


Comments

Popular posts from this blog

javascript - Slick Slider width recalculation -

jsf - PrimeFaces Datatable - What is f:facet actually doing? -

angular2 services - Angular 2 RC 4 Http post not firing -