Tag Archives: xform

Displaying a form created with x-form via Design -> Layout

Unfortunately, it is not possible to add the form directly from the Design -> layout.

But here is a workaround:

1. First, copy the iframe code of a form from the form Setting -> Shorcode/Url tab

2. Now add an `HTML Content` module from Extension -> Modules -> Html Content

3. Please click the `Code View` icon to switch into `Code mode` and paste the copied iframe code

4. Now You can add this module from Design -> Layout

How to overwrite the default contact us form with a form created by xform?

You will have to do the following steps if you want to overwrite the default contact form with a form created by xform.

  • Please navigate to X-Form and click the Cog icon of the form you want to overwrite with.
  • Now navigates to the Integration tab. Tick the checkbox Enable For Layout Position
  • On the Custom CSS section, add the following CSS rules
#information-contact form.form-horizontal {
    display: none;
}
#information-contact h2 {
   display: none;
}
  • Click the Save and Continue button to store the changes.
  • Now navigate to Design -> Layout, Now edit Contact Layout. Finally, add the Form under the X-Form to the Content Bottom position.

That’s all.

Xform field validation using regular expression

xform regular expression for validation

Title Expression Example
US phone validation      /^\(?(\d{3})\)?[-\. ]?(\d{3})[-\. ]?(\d{4})$/ 555-555-1212, (555)-555-1212), 555 555 1212, 555.555.1212, (555).555.1212
UK Phone Validation  /^(\+44\s?7\d{3}|\(?\d{5}\)?)\s?\d{3}\s?\d{3}$/ 07222 555555, (07222) 555555, +44 7222 555 555
ZIP code validation    /^[0-9]{10}$/  
UK postal validation    /[A-Z]{1,2}[0-9][0-9A-Z]?\s?[0-9][A-Z]{2}/i  
Image Validation   /jpeg|png|gif|jpg/  jpg, png and gif
Image Validation with mime type   /image\/jpeg|image\/png|image\/gif|image\/jpg/  jpg, png and gif
PDF file validation  /application\/pdf|application\/x-pdf/  
Alphabet String Length   /^[a-zA-Z]{3,7}$/   Min length 3 and max length is 7
Any String Length   /^.{5,20}$/   Min length 5 and max length is 20
Restrict/Block HTML   /^(?!.*((<.*?>.*?<\/\w+>)|(:\/\/)))/