Form Component

Forms, webforms, CSS forms. They have many names, many functions, and appear nearly everywhere—from internal applications to outward-facing websites.

What is a form component?

A form component is a structured and styled modal that displays controls that users can interact with. A control is an element like a checkbox, button, dropdown menu, etc., and each one serves a specific purpose. Controls are often called “fields.”

Once the controls or fields have been filled out, a form can be submitted.

What do form components do?

Form components are extremely versatile. A basic form might collect fields like first name, last name, email address, and submit the results to a website to be added to a mailing list. This is the typical “webform” usage.

A bit more complex in functionality, online purchasing is also done with form components. These typically collect name, email address, physical address, and then card or payment information. Upon submitting the form, a the payment is processed and the order is released to fulfillment.

Internal tool developers also use form components all the time. If connected to a data source, forms can be used to submit requests that directly manipulate data. Having a form in an internal workspace that reads and writes data is often a super expedient way to make changes compared to doing it manually each time. The form only needs to be set up once.

Populating form fields

Each form field maps to a data field in a database. Most webforms only write data, although forms can also be configured to populate controls based on existing data from a data source.

A webform that collects first name, last name, and email address for a mailing list will create an entry in an email marketing audience with the submitted credentials.

Internal forms used for development purposes are usually populated with fields from a data source as well, but they often read and write instead of just writing, saving time for developers who would otherwise have to perform manual action.

Forms in Internal

Internal features a pre-made form component, usable the moment a data source is connected to a workspace. Each field can be dynamically mapped to read/write from a data source (like a table), and can even have conditional formatting that displays or hides fields depending on pre-determined values.

Forms can also interact with data from other components like card lists or detail views, which is super useful if these components already exist in the workspace.

To learn more about what Internal form components can do, check out the forms documentation in our help center.

Resources:

W3 Schools: HTML Forms

CSS Tricks: Tips for creating great forms