Skip to main content

Data Table

With this video lesson you will learn to display the records from a collection on a UI for your web application.

1. Adding a Component

To showcase your records in the form of table go to Components and choose Data Table. Drag-and-drop this component on the page and Save.

DrapCode SignUp Form

2. Fetch Records

Open the Data Table Settings and choose to get data from collection, mention the collection name and the items to be fetched and Save. This will build a table on your page.

DrapCode SignUp Form

3. View the Data Table

After modifying and saving the table click Preview to view all the records.

DrapCode SignUp Form

4. Adding an Image

To add an image go to Components and choose Image. Insert the component with image it in your Data Table and Save. Reload the Preview page and you will find the new changes.

DrapCode SignUp Form

5. Apply Pagination

By default you can display 10 records per page. However you can apply pagination by opening the Settings of your Data Table and choosing Record Per Page and then Save. Reload the Preview page and you will find the new changes.

DrapCode SignUp Form

6. Downloading Data

To download records click Download CSV.

DrapCode SignUp Form