Thursday, January 17, 2013

Remove Back and Forward slash from form fields




Today morning, I have got a requirement from my client, which says, Please allow all special characters except / and \ to be used in the "FirstName" and "LastName" fields.


Solution:

To fullfill the requirement, I have been implemented both client and server side validation.

Here is the code  snippet for my form:

<cfform name="Volunteer" action="#root#user.editvolunteerprocess" method="post"> 
<table cellspacing="0" class="adminform">
<cfoutput>
              <tr>
                     <td class="sectiontitle">
                           Basic Information
                     </td>
                     <td>&nbsp;</td>
              </tr>
         <tr>
              <th>#myprogram.getVolunteerAlias()# First Name </th>
              <td><cfinput type="text" name="FirstName" id="FirstName" value="#variables.FirstName#"
                     required="yes" size="32" maxlength="72"
                     message="Please enter Volunteer First Name." >
              </td>
         </tr>
         <tr>
              <th>#myprogram.getVolunteerAlias()# Last Name</th>
              <td><cfinput type="text" name="LastName" id="LastName" value="#variables.LastName#"
                     required="yes" size="32" maxlength="72"
                     message="Please enter Volunteer Last Name.">
              </td>
         </tr>
         <tr>
              <th>#myprogram.getVolunteerAlias()# E-mail Address</th>
              <td><cfinput type="text" name="Email" value="#variables.Email#"
                     required="yes" size="32" maxlength="64"
                     message="Please enter a valid E-mail Address."
                     validate="regular_expression" pattern="^[\_a-zA-Z0-9\-][\_a-zA-Z0-9\-]*(\.[\_a-zA-Z0-9\-][\_a-zA-Z0-9\-]*)*@[a-zA-Z0-9\-][a-zA-Z0-9\-]*(\.[a-zA-Z0-9\-][a-zA-Z0-9\-]*)*\.(([a-zA-Z]{2,3})|(aero|coop|info|name))$">
              </td>
         </tr>
         <cfif user.getUserID() neq "">
                <tr>
                     <th>Password</th>
                     <td><cfinput type="text" name="Password" value="#variables.Password#"
                           required="yes" size="32" maxlength="72"
                           message="Please enter a valid password up to 24 characters that contains only letters and/or numbers (no spaces)."
                           validate="regular_expression" pattern="^[^ \t\v\n\r\f][A-Za-z_0-9]+$">
                     </td>
                </tr>
         </cfif>
              <tr>
              <tr>
              <th>Active</th>
              <td><input name="Active" type="checkbox"
       value="1" <cfif Variables.Active>checked</cfif>><!--- #YesNoFormat(Active)# --->
              </td>
              </tr>  

       </table>
       <div class="submit">
       <table cellspacing="0"><tr>
<td><input type="submit" name="Action" value="Update" onClick="javascript: return validateForm();"></td>
                          
       </tr></table></div>
       </cfoutput>
</cfform>



To Implement the client side validation,

I tried to keep restricted charcters (here forward and backward slash)in a js variable, like

var restictedChar = ‘/\’;

 but it throws an unterminated string literal error. To overcome this I have used ascii number to validate the presents of slashes.Below is the js code snippet to validate slashes in FirstName" and "LastName" fields.

      
      validateForm = function()
       {
             
              var errFlg = false;
             
              /*read the input value from First Name & Last Name fields*/
              var txtFname = document.getElementById("FirstName").value;
              var txtLname = document.getElementById("LastName").value;
             
              var fldName = ""
             
              /*Validation for First Name*/
              for(count = 0; count <= txtFname.length; count++)
              {
                     if( Number(txtFname.charCodeAt(count)) == 47 || Number(txtFname.charCodeAt(count)) == 92)
                     {
                           errFlg = true;
                           fldName = 'First Name';
                           break;
                     }     
              }
             
              /*Validation for Last Name*/
              for(count = 0; count <= txtLname.length; count++)
              {
                     if( Number(txtLname.charCodeAt(count)) == 47 || Number(txtLname.charCodeAt(count)) == 92)
                     {
                           errFlg = true;
                           if(fldName == "")
                                  fldName = 'Last Name';
                            else
                                  fldName = fldName + ', Last Name';
                           break;
                     }     
              }
             
              if(errFlg)// if there any restricted character
              {
                     alert('You have been entered invalid character (/ or \\) in ' + fldName +'\n, Please correct it and then update.');
                     return false;
              }
              else
                     return true;
       }




Using CF Regular Expressions to validate FirstName" and "LastName" fields.


<cfif not reFind("[/\\]",form['FirstName']) AND not reFind("[/\\]",form['LastName'])>
              Save the Result
<cfelse>
              exit without saving
</cfif>

No comments:

Post a Comment