A form serves as an interface for the visualization and manipulation of a data entity. Essentially, it acts as a field aggregator.
Although always associated with a data entity, it is not mandatory for it to contain all the fields related to it; it can be customized according to demand. This way, it is possible to create different forms for the same entity, adapting to various needs. For example, a purchase form may include fields such as ID, customer, and date.
To create a form, follow the steps below:
- In the VTEX Admin, access Store Settings > Storefront > Master Data.
- Make sure that you are in the Applications tab.
- In the application in which you want to create the form, click on the gear icon .
- After opening the list of forms, click
New
. - Fill in the fields as described in Fields for the new form.
- Click
Save
.
Fields for the new form
-
Nome: Form name.
-
Filters: Fields marked as entity filters; these fields will make up the side filters of the form. The internal name of the field must be entered. If there is more than one field, separate them with comas. For example: campo1,campo2.
-
Data entity: This is the data entity in which the form will save and display the data.
-
Search highlights: Fields that will be listed in the search results. The internal name of the field must be entered. If there is more than one field, separate them with comas. For example: when searching for a customer, the list of results must include the customer’s ID and name; so, the field must be filled out with
id,nome
. -
View queries: Enables a new section in the display form with the records of an entity related to the form’s entity. The information displayed will relate to the record that is being viewed.
For example, the Shopping List entity includes a field whose type is Relationship, which is related to the Customer entity. So, in the View queries field of the Customer form, you must enter the Shopping List field that refers to the Customer.
If the acronym of the Shopping List entity is SL, and the name of the field is Customer, you must enter:
SL.Customer
to upload the customer service that is being viewed in the form.
After filling out the mandatory fields, the tabs available for configuration will be displayed. See below the fields of these tabs.
-
List Fields: Select the fields included in the records list when clicking to view the form. To this end, just select the check boxes appearing at the side of the fields that you want to appear on the list. It is also possible to set up the width of the field on the list (column width), the display order and the ordering.
The order of the fields on the list will follow the order viewed in this screen, that is, for a field to appear in the first column, click on the up arrow until it becomes the first field. Ordering is defined by one field. Select one field and choose between ascending (Asc) or descending (Desc) order.
-
Layout Schemas: definition of how the fields will be displayed in the form, both for viewing, and for editing and creating the fields. That is, the position of each field in the form will be set up in this phase, and they also be divided by sections.
- Click on the
Add New Section
button. - Fill out the Name field to name the section.
- Drag one field from the Available Fields list to the Fields of Column 1 column. The same can be made regarding the Fields of Column 2 column.
Repeat these three steps until you reach the format desired for the form. You can include several fields in a single column, as well as create several sections.
- Click on the
-
Queries: This tab is only intended to show the queries created on the list.
-
Style Sheet: Tab to enter the CSS to edit the frontend of the form.