Paul1 wrote: I have a form created dynamically from a database. Folk using the form select several of the checkboxes and submit the form. </head> <cfquery name="criteria_list1" datasource="my_data"> select * from CRITERIA </cfquery> <body> <cfform id="form1" name="form1" method="post" action="selection.cfm"> <table width="98%" border="0"> <tr> <td colspan="2"><h2>Please select your criteria (Select as many as you wish)</h2><</td> </tr> <cfoutput query = "criteria_list1"> <tr> <td>#CRITERIA_NAME#</td> <td><cfinput type="checkbox" name="checkbox" value="#id#" /></td> </tr> </cfoutput> </table> <p> <input type="submit" name="Submit" value="Submit" /> <input type="reset" name="Submit2" value="Reset" /> </p> </cfform> </body> This works fine except if someone does not tick any of the boxes. If this happens an error is returned: "Element CHECKBOX is undefined in FORM." Could anyone tell me how I could validate the form to make sure that people using it tick at least one checkbox. |
When the user leaves a checkbox field unchecked, the form doesn't submit the field. That is so by design. A simple script, like the one below, can solve your validation problem.
However, that wasn't the only problem. You dynamically generate a number of distinct checkboxes, yet you give them all the same name, "checkbox".
I have corrected this, using a list to simulate your query. The principle remains the same. I have used the id from the list to give each checkbox a unique name and identity.
<cfif isDefined("form.submit")>
Form submitted
<cfdump var="#form#">
</cfif>
<script type="text/javascript">
function validateChkBx () {
var isOneBoxChecked = document.getElementById('chkbx_1a').checked || document.getElementById('chkbx_2b').checked || document.getElementById('chkbx_3c').checked;
if (isOneBoxChecked)
{
return true;
}
else
{
alert('You must check at least one checkbox.');
return false;
}
}
</script>
<cfset IDList = "1a,2b,3c">
<cfform action="#cgi.script_name#" method="post" onsubmit="return validateChkBx()">
<cfloop list="#IDList#" index="id">
<cfinput name="chkbx_#id#" id="chkbx_#id#" type="checkbox" value="#id#">
</cfloop>
<cfinput name="submit" type="submit" value="submit">
</cfform>
5
Replies
AdChoices