Hi guys

 

I have these forms for an insurance agency and they have a yes/no questions. They want the form to gray out or not let the person submit the form if they hit no. Right now it still submits but just says no. I know there's a way to do this can you guys help? Thanks!

Hi guys

 

I have these forms for an insurance agency and they have a yes/no questions. They want the form to gray out or not let the person submit the form if they hit no. Right now it still submits but just says no. I know there's a way to do this can you guys help? Thanks!

 

 

You'll need AJAX to make the form gray out before submission. Alternatively you can use a javascript function when the form is submitted to check for any "no" answers, if it finds any then it will display an error and return to the page.

 

HTML form

<form id="feedback" onSubmit="return checkform()">
<input type="radio" id="field1" value="yes" />Yes
<input type="radio" id="field1" value="no" />No

<input type="radio" id="field2" value="yes" />Yes
<input type="radio" id="field2" value="no" />No
</form>

 

Javascript Code

function checkform()
{

if (!document.feedback.field[0].checked ||
document.feedback.field[1].checked) {
// field[0] would be the yes button, field [1] would be the no button
   alert ("cannot proceed as you have answered no to one of the questions");

return false;
}

if (!document.feedback.field[2].checked ||
document.feedback.field[3].checked) {
// field[2] would be the yes button, field [3] would be the no button
alert ("cannot proceed as you have answered no to one of the questions");
return false;
}
return true;
}

 

 

To be honest, this is a crude and not very well thought out solution, if you have a lot of questions it might take a while to check.

 

I think you'll need AJAX for this one. Anyone good with that? Cos i aint!

Hi Seth, here's a simple script to grey out the submit button until the required buttons are checked.

HTML

<form name="agreeform">
 <input id="agreecheck" name="agreecheck" type="checkbox" /><b>I agree to the rules</b><br>
 <input id="understand" name="understand" type="checkbox" /><b>I have read the above and understand it</b><br />
 <input id="confirmplace" name="confirmplace" type="checkbox" /><b>I understand that filling the form does not guarantee a place.</b><br />
<input id="submit" type="Submit" value="Submit!" />
 </p>
</form>

 

Javascript

<script>

function agreesubmit(){
if (document.all||document.getElementById){
if (document.getElementById("agreecheck").checked && document.getElementById("understand").checked && document.getElementById("confirmplace").checked) {
document.getElementById("submit").disabled = false;
} else {
document.getElementById("submit").disabled = true;
}

}

}
window.onload = function() {
document.getElementById("submit").disabled = true;
document.getElementById("agreecheck").onclick = agreesubmit;
document.getElementById("understand").onclick = agreesubmit;
document.getElementById("confirmplace").onclick = agreesubmit;
document.form.agreeform.agreecheck.checked=false;
document.form.agreeform.understand.checked=false;
document.form.agreeform.confirmplace.checked=false;
}
</script>

The example uses checkboxes but the principle works the same for radio buttons.

Might be a bit unwieldy if you have lots of fields to check but I'm sure you can adjust it to suit.

If you need a hand, just ask.