Template Builder Guides
      Back to home
      1. Corfix Guide
      2. Template Builder Tutorials
      3. Template Builder Guides

      Corfix Form Builder: Using the Address Component

      This article will summarize how to use the Address Component in Template Builder.

      This component is designed to collect address information, often with features like auto-completion for convenience.

      Where to Find It

      In your Corfix Form Builder, click on a Address Component to access the configuration panel. You’ll see four tabs:

      • Display

      • Data

      • Validation

      • Conditional

      1. Display Tab

      The Display tab controls how the Address Component appears to the user.

      • Label:

        • This is the visible title for your address field that users will see. It is a required field.

        • Example: "Site Address", "Location".

      • Label Position:

        • Determines where the label is displayed relative to the address input box (e.g., Top, Left, Right, Bottom).

        • Default: Top.

      • Enable Manual Mode:

        • If checked, this likely allows users to manually type in the full address details if the auto-completion or search feature isn't suitable or preferred.

      • Placeholder:

        • Text that appears inside the input field before the user types anything. It's a hint to the user about what to enter.

        • Example: "Enter a location", "Street, City, Postal Code".

      • Description:

        • Provides additional explanatory text for the field, typically displayed below the input box.

        • Example: "Please enter the full site address, including city and postal code."

      • Tooltip:

        • Text that appears when the user hovers their mouse over the field. Useful for providing quick help or context.

      • Custom CSS Class:

        • Allows advanced users to apply custom styling to the component using CSS classes.

      • Hide Label:

        • If checked, the label for the address field will not be displayed.

      • Modal Edit:

        • (Details not fully visible in screenshot, but typically relates to editing the address details in a pop-up modal window).

      • Reportable:

        • If checked, the data from this field will be included in reports.

      2. Data Tab

      The Data tab manages the underlying data properties of the address field.

      • Multiple Values:

        • If checked, allows the user to enter multiple addresses for this field (e.g., for different site locations).

      • Default Value:

        • The pre-filled address that appears in the input field when the form loads. Users can override this value.

      3. Validation Tab

      The Validation tab defines rules to ensure the address data entered by the user meets specific requirements.

      • Required:

        • If checked, the user must enter an address in this field before submitting the form.

      4. Conditional Tab

      The Conditional tab allows you to set up rules for when this Address Component should be displayed or hidden based on the values of other components in the form.

      • Simple:

        • This is typically a toggle or a dropdown to select between simple and advanced conditional logic.

      • This component should Display:

        • Choose whether the component should "Show" or "Hide" (implied options) based on the condition.

      • When the form component:

        • Select another component in your form whose value will trigger the condition.

      • Has the value:

        • Specify the exact value that the selected form component must have for the condition to be met.

        Example: You could set up a rule so that a "Shipping Address" field only displays when "Different Shipping Address?" checkbox is checked.

      Preview Panel

      The Preview panel on the right side of the dialog box shows you how the "Address" input field will visually appear on your form. It typically includes a text input field, and might hint at auto-completion features (like "Enter a location") depending on its configuration.

      Actions at the bottom of the dialog:

      • Save: Saves all changes made to the Address Component's settings.

      • Cancel: Discards any unsaved changes and closes the dialog.

      • Remove: Deletes the Address Component from the form.

      Best Practices for Address Component:

      • Clear Label: Use a specific label (e.g., "Job Site Address," "Billing Address") to avoid confusion.

      • Enable Manual Mode (if needed): Consider enabling "Manual Mode" if automated address lookup might not always find niche locations or if manual entry is a common need.

      • Make it Required for Critical Data: If an address is essential for a record (e.g., for work orders or contact information), check the "Required" box.

      • Use Placeholder for Guidance: A placeholder like "Enter a location" guides users on how to start typing for auto-completion.

      • Conditional Display: Hide the address field if it's not always relevant, showing it only when a user's previous input requires it (e.g., show "Secondary Address" if "Add another address" is selected).