javascript - Validate that ALL radio buttons are selected or NOT on button Click -
i new javascript , have javascript function called on button click. want show alert if radio buttons have not been selected wether yes or no , if have been selected call function called addpoints() below.
function validateform(){ var inputs = document.queryselectorall('input[type="radio"]'); var formvalid = false; for(var i=0;i<inputs.length;i++){ if(inputs[i].checked){ formvalid = true; } } if(!formvalid ){ alert("please answer questions!"); } else{ addpoints(); } }
below how radio buttons presented
<form name="form1" id="form1"> <input id="rdo1" type="radio" name="q1" value="10">yes<br> <input id="rdo2" type="radio" name="q1" value="0">no </form> <form name="form2" id="form2"> <input id="rdo3" type="radio" name="q2" value="10">yes<br> <input id="rdo4" type="radio" name="q2" value="0">no </form> <form name="form3" id="form3"> <input id="rdo5" type="radio" name="q3" value="10">yes<br> <input id="rdo6" type="radio" name="q3" value="0">no </form> <button type="submit" onclick="validateform()">score?</button>
if not select radio button when page loads , call function validateform() using button message correct , states "please answer questions". if select either yes or no group calls addpoints function. want call function when either yes or nos have been selected radio groups.
demo
code:
function addpoints() { alert("adding points"); } function validateform() { var inputs = document.queryselectorall('input[type="radio"]'), // empty array checker = []; (var = 0; < inputs.length; i++) { if (inputs[i].checked) { // whenever find checked element, push in checker array checker.push(true); } } // since, there 3 radio groups, according op, // call addpoints when 3 (yes/no) have been selected if (checker.length === 3) { addpoints(); } // show alert if none has been selected else if (checker.length === 0) { alert("please answer questions!"); } else { // add may want } }
Comments
Post a Comment