Skip to main content
P
Paul13
Known Participant
January 27, 2012
Question

validating checkboxes

  • January 27, 2012
  • 3 replies
  • 9176 views

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.

Thanks,

Paul.

    This topic has been closed for replies.

    3 replies

    BKBK
    Community Expert
    BKBKCommunity Expert
    Community Expert
    January 29, 2012

    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>

    D
    Dan_Bracuk
    Inspiring
    January 27, 2012

    You'll have to do this in javascript.  A google search on "java validate checkbox" will lead you to code samples.

    P
    Paul13Author
    Known Participant
    January 27, 2012

    Hi Dan,

    I wasn't sur eabout the javascript as this is not a form that I have manually put together... I'l go a search for check box validation,

    Thanks,

    Paul.

    S
    Steve Sommers
    Legend
    January 27, 2012

    There are several ways to solve this issue. When I first started CF programming, the trend at the time was to put a hidden field within the form with the same name and a value of "". Over the years the best method I found was simply to use the cfparam tag in the action page for all form field variables:

    <cfparam name="form.checkbox" default="" />

    ...

    This way, "checkbox" always exists. Then you can do stuff like:

    <cfif NOT len(form.checkbox)>

         <cfabort showerror="FIELD VALIDATION ERROR: You must select an option." />

    </cfif>

    This method works for all field except FILE.

    P
    Paul13Author
    Known Participant
    January 27, 2012

    Hi Steve,

    The <cfparam name="form.checkbox" default="" /> seems to work. I'll look a bit closer at the actions I can do.

    Thanks,

    Paul

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices