3 Replies Latest reply on Dec 23, 2012 10:21 PM by Blackmore111

    How to show one message when validation of several required fileds fails

    Blackmore111

      Hello.

       

      I'm using ColdFusion 9 and I have a question.

       

      When we have a form with required fields coded like this:

       

      <cfinput ... required="yes" message="Enter a value 1" />

      <cfinput ... required="yes" message="Enter a value 2" />

      <cfinput ... required="yes" message="Enter a value 3" />

       

      When user sumbits this form he will se an alert window:

       

      Enter a value 1

      Enter a value 2

      Enter a value 3

       

      How can I make it other way so then one single message is outputted like:

      "Enter values for all required fields"

      Not one message for each required field.

       

      Sorry for my imperfect English. Thank you.

        • 1. Re: How to show one message when validation of several required fileds fails
          BKBK Adobe Community Professional & MVP

          I don't think the automatic validation built into cfinput will allow you to do that. You should create your own validation. Here is an example to get you started:

           

          <script language="javascript" type="text/javascript">

              function validate() {

                  // the values of the required fields

                  var a_val = document.getElementById("a_id").value;

                  var b_val = document.getElementById("b_id").value;

                  var c_val = document.getElementById("c_id").value;

           

                  // trim any leading and trailing spaces

                  a_val = a_val.replace(/^\s+|\s+$/g,'');

                  b_val = b_val.replace(/^\s+|\s+$/g,'');

                  c_val = c_val.replace(/^\s+|\s+$/g,'');

           

                  // validate

                  if(a_val=='' || b_val=='' || c_val=='') {

                          alert('You must enter values for the required fields a, b and c');

                          return false;

                  }

                  else

                  return true;

              }

          </script>

           

          <cfif isdefined("form.sbmt")>

          <cfdump var="#form#">

          </cfif>

           

          <cfform onsubmit="return validate()">

          a:<cfinput name="a" id ="a_id" type="text">

          b:<cfinput name="b" id ="b_id" type="text">

          c:<cfinput name="c" id ="c_id" type="text">

          <cfinput name="sbmt" type="submit" value="send"/>

          </cfform>

           

          This is just a basic validation script to illustrate the principle. You may of course make it as sophisticated as you want, or even import specialized Javascript libraries to do the validation for you.

          • 2. Re: How to show one message when validation of several required fileds fails
            Blackmore111 Level 1

            Thank you very much, that's the very thing I needed.

            • 3. Re: How to show one message when validation of several required fileds fails
              Blackmore111 Level 1

              So, thanks to BKBK, I created an universal solution to this. Here it goes if anyone'll need it.

              Here is cffunction that generates validation code:

               

              cffunction name="generate_validation" access="public" returntype="string">

                                  <cfargument name="fieldList" type="string" required="yes">

                        <cfoutput>

                                  <cfsavecontent variable="scr">

                        function validate() {

                      <cfloop list="#fieldList#" index="i">

                        var val_#i# = document.getElementById("#i#").value;

                        val_#i# = val_#i#.replace(/^\s+|\s+$/g,'');

                        if (val_#i# == '')

                        {

                         document.getElementById("#i#").focus();

                         alert('Please fill all required fields!');

                         return false;

                        }

                      </cfloop>

                      return true;

                  }

               

               

              </cfsavecontent>

              </cfoutput>

                                  <cfreturn scr>

                        </cffunction>

               

               

              And it works from .cfm page like this:

               

              <cfinvoke component="iCFC.udfs" method="generate_validation" returnvariable="scr" fieldList="name,image,code,manual_create_order" />

              <cfoutput>

                  <script>

                      #scr#

                  </script>

              </cfoutput>

                <cfform onsubmit="return validate()" action="contents/service/process_service.cfm" name="fProcess" method="post" >