Comment on page
Discover how to utilize components to build your app's user interface
Components are prebuilt UI elements your users engage in, such as
Buttons. In this example, only a limited number of components are used; you can explore 50+ Components in the UI Component Library. Drag-and-drop components within Layout
Modals, facilitating the building of your app.
You'll be building an app that enables the creation and updating of Deals data. To enable this functionality, you'll add
Modals. Learn more about Jet UI Concept in our documentation. Additionally, if you want to implement this functionality swiftly (Create, Update, Delete flow), you can generate it in seconds using Page Templates.
Columnsare used to set the horizontal component of the layout. You can add multiple columns and resize them.
When you select the Table component, the right panel automatically updates to display the properties of the component. Components come with a wide range of properties that you can configure. Properties are accessible from other components and queries, allowing for a more integrated and dynamic user interface experience.
Click Data Source – Jet Tables and the Deals collection that you've created.
Modify the Logo column to have a circular frame and position it as the first column.
Component Binding allows the passing of values between components. In this case, we will bind the
Filtercomponents, enabling users to filter Deals by criteria such as
Every field in the Form is individually configurable: you can add or remove fields from the Form, alter the field type, rearrange the order of the fields, and change appearance.
To update a deal, the user must select the corresponding row in the Table. You can configure the first row to be selected by default in a
Table. To do this, go to the Display tab in the
Tableproperties and choose Select the first row by default.