Customizing Form Fields

Customize and configure form fields for truly dynamic forms

Creating a seamless and intuitive user experience is paramount in form design, and with Noloco, each field in a Form can be meticulously customized and configured to suit your specific needs. Here, we'll break down how to utilize each form field option to build truly customizable forms in your Noloco app.

The configuration options for a given form field will depend on the type of field, but most form fields have the following options:

  • Label

  • Help Text

  • Placeholder

  • Default Value

  • Required

  • Validation

  • Conditional Visibility Rules

  • Field Width

Some fields have the following, optional options in addition to the core options above:

  • Display As

  • Options Filter

  • Sorting

Label

The Label is the identifying name displayed for each field in your form. Use clear and concise wording to help users understand the information required in each field.

Help Text

Help Text provides additional information or instructions to users, clarifying any uncertainties and guiding them to input accurate data.

Placeholder

A Placeholder is a hint or example text displayed in the field before the user inputs their information. Use this to suggest the expected format or to provide an example entry.

Default Value

Assigning a Default Value automatically populates a field with a predetermined entry. This is beneficial for accelerating the form-filling process and ensuring consistency in responses.

A default value can also be chosen from a property of a selected field. For example, if you had a form to send an email, and the form allows you to pick a template. The default value for the Email's Subject could be the Template -> Subject

If the Subject field is empty when the Template is chosen, the subject's value will now be the Template's Subject.

Required

Marking a field as Required ensures that users cannot submit the form without completing that particular field, thereby guaranteeing that crucial information isn’t omitted.

Conditionally Required Rules

When you mark a field as required, you can then specify rules to only make the field required based on the values or conditions of other fields, offering a dynamic approach to form completion and data collection.

Validation Rules

Validation Rules enable you to set specific criteria that the inputted data must meet, reducing errors and ensuring the integrity and accuracy of collected data.

Learn more about Field Validation Rules

Conditional Visibility Rules

With Conditional Visibility Rules, you can determine which fields are visible based on the values or conditions of other fields, making your forms more adaptable and user-friendly.

Field Width

Adjusting Field Width allows you to control the horizontal space that a field occupies in your form, aiding in the optimal arrangement and visual flow of your form. This can let you have two or more fields in the same row.


The following field options are only present on some fields, when the option is available

Display As

Available on Linked Record Fields, Single Option Fields, Multi Option Field, Multi-Line Text Fields

This option controls how the form input is displayed.

The display options shown will depend on the field type. The following field types have the following display options:

Linked Records

  • Default: A dropdown with the ability to search for records

  • List: An inline list with 3-5 records previewed, and the ability to search for records

Single Option Fields

  • Default: A dropdown with the valid options

  • Radio Buttons: All of the options are presented with a radio input option

  • Colored Options: Like the default dropdown, but the options are colored badges

Multiple Option Fields

  • Default: A multi-select dropdown with the valid options

  • Checkboxes: All of the options are presented with a checkbox input option

  • Colored Options: Like the default multi-select dropdown, but the options are colored badges

Multi-Line Text Fields

  • Default: A text area that grows as the content grows

  • Rich Text: A rich text editor with the ability to control formatting such as bold, italic. It outputs Markdown

Options Filter

Available on: Linked fields

Options Filter enables the customization of visible options in linked record fields, ensuring users only see relevant choices. Read more about filtering collections

Sorting

Available on: Linked fields

Sorting allows you to determine the order in which linked record fields are displayed, making it easier for users to locate and select the appropriate option. Read more about Sorting

Limit File Upload Type

Available on: File upload fields

Limiting file upload type allows you to restrict the types of files that can be uploaded. This can be achieved by choosing which file types you wish to allow in the editor under "Allowed File Types"

How to limit file upload type

The MIME types that are allowed within the different File Types covered are listed below:

Audio
  • AUDIO_3GPP

  • AUDIO_3GPP2

  • AUDIO_AAC

  • AUDIO_MPEG

  • AUDIO_WAV

  • AUDIO_WEBM

Images
  • IMAGE_BMP

  • IMAGE_GIF

  • IMAGE_HEIC

  • IMAGE_JPEG

  • IMAGE_JPG

  • IMAGE_MS_ICON

  • IMAGE_PNG

  • IMAGE_SVG

  • IMAGE_WEBP

Video
  • VIDEO_3GPP

  • VIDEO_3GPP2

  • VIDEO_MPEG

  • VIDEO_WEBM

  • VIDEO_MP4

  • VIDEO_MOV

Text
  • APPLICATION_JSON

  • TEXT_CSS

  • TEXT_CSV

  • TEXT_HTML

  • TEXT_JAVASCRIPT

  • TEXT_PLAIN

  • TEXT_XML

Documents
  • MS_DOC

  • MS_DOT

  • MS_DOCX

  • MS_DOTX

  • MS_DOCM

  • MS_DOTM

  • MS_MSG

  • MS_XLS

  • MS_XLT

  • MS_XLA

  • MS_XLSX

  • MS_XLTX

  • MS_XLSM

  • MS_XLTM

  • MS_XLAM

  • MS_XLSB

  • MS_PPT

  • MS_POT

  • MS_PPS

  • MS_PPA

  • MS_PPTX

  • MS_POTX

  • MS_PPSX

  • MS_PPAM

  • MS_PPTM

  • MS_POTM

  • MS_PPSM

  • APPLICATION_PDF

  • APPLICATION_XML

Read more about File/Upload

Last updated