When Fonteva started development on the Lightning platform, the developers involved discovered a lot of need for duplicate code. Developers found that multiple lines of code were needed to instantiate each inputField. Additionally, many attributes needed to be manually configured for each instance. To simplify this process, Fonteva wrapped each inputField and reduced the required code to a single line. This wrapper also protects your Fonteva app from Salesforce change. Wrapping these inputFields provides a seamless experience for Fonteva's users in spite of changes.

Additionally, wrapping these components allows for extended functionality - including the ability to inject CSS Classes, create overrides, and group fields together.

While Salesforce provides many fields out of the box, the functionality of those fields can be limited. To address this, Fonteva has wrapped some of those objects to extend their functionality. Additionally, Fonteva has simplified the process of adding input fields. You only need to provide a few attributes, instead of writing multiple lines of code every time you need to add a new field.

Some inputField features include:

  • Grouping fields together.
  • Seamless change.
  • Customized templates.
  • Customized field formats.

Instantiating an inputField

An Aura Method is required to instantiate an inputField. See FrameworkInputFields for more information.

For example, Fonteva has simplified adding a Rich Text Editor to a single array.

Rich Text Editor Field

<Framework:InputFields qaData='{"type" : "input", "name": "registrationInformation"}' group="ticketTypeBuilder" fieldType="richtext"
                   aura:id="registrationinformation" label="{!$Label.c.Ticket_Information_Event_Builder}" value="{!v.ticketTypeObj}"
                   helpText="{!$Label.c.Event_Builder_Tickets_Ticket_Information}" />
JS

 

The above line of code renders a Rich Text Editor Field.

For visual examples and how data is parsed by each inputField type, add /apex/Framework__playground to the end of your Salesforce org's root URL - for example, https://your-org-name.na73.visual.force.com/apex/playground

Configurable Attributes

Fonteva allows you to extend the functionality of input fields by customizing the following attributes:

  • label - The field label.
  • id - The HTML ID of the field.
  • fieldType - The type of field you want to render. (e.g.: rich text). See Supported fieldTypes for more information.
  • value - Can be an sObject or it can be a JavaScript map. The key in the value object is the Aura ID.
  • sObjectName & fieldName - Renders the appropriate field type based on your Salesforce SObject field type. See Attributes: sObject Name and fieldName for more information.
  • isRequired - Marks this field as a required entry by placing a red asterisk next to the field label.
  • minValueValidationMessage & maxValueValidationMessage - Allows you to add custom validation messages for minimum and maximum values in your input fields. This attribute also automatically appends the required minimum value to this message.
  • helpText - Renders a tooltip next to the field. If no custom message is provided, the default Salesforce helper text is displayed. See Tooltip for more information.
  • selectOptions - A picklist attribute. The list can be provided by inserting an array into otherAttributes. If you provide the sObjectName and fieldName, the default picklist is rendered from the Salesforce sObject. This list can also be provided upon initialization or by using the setSelectOptions method.
  • maxLength - The maximum number of characters that can be entered in a field.
  • group - Allows you to group fields together.
  • secondaryGroup - Creates a nested group within the group attribute above.
  • fireChangeEvent - Fires an event if a specific value is changed. That event sends a variety of data including the new value and old value. See (link to be added) for more information.
  • format - Sets the format of data to be entered. It will also auto render if the field is a Salesforce sObject. For example, for currency is more than two decimal places are entered, this attribute automatically truncates the data. (e.g., 2.369 is entered, but 2.36 is saved).
  • disable - Marking this attribute "True" disables the inputField.
  • otherAttributes - Provides a map of attributes for all objects. When this attribute is applied, each value within becomes a top-level attribute.
  • validated - Performs validation of your fields and displays error messages. Custom messages can be entered into otherAttributes. When this method is run, it will provide the Aura ID's validation status.
  • secondaryId & useSecondaryId - Sets your destination value dynamically. See Attributes: Using Dynamic SObject Values for more information.
  • labelStyleClass - Provides custom CSS classes for inputField labels.

  • Fonteva supports the following attributes for Salesforce default fields only:
    • format
    • disabled
    • placeholder
    • updateon
    • name
    • rows
  • For custom inputFields, all otherAttributes are supported.