Tables with editable items

Allow the users to modify the tables' items and save the results in your database or connected enterprise software.

Example

Here’s an example of an editable table.

Why to use?

You can use the tables with editable items to provide the enterprise business users the opportunity to apply changes into the table by modifying or deleting items.

Guidance

The general guidance for using tables can be found here, and guidance for forms can be found here.

Define editable options

The next options available for the editable table: edit an item, duplicate item, add a new item, and delete item. You can activate all of them or only one.

Define which fields can be changed

By adding the option to change the items, you need to consider that some fields can't be changed, e.g., the object's id, date of creation, etc. It is crucial to defined which fields are available for modification to avoid any errors afterward.

Add multi-select

It is better to design a separate conversation flow for actions. For example, you can have a conversation flow that starts if the user inputs the intent "Delete the assets", in that case, you can add multi-select to give the option to the user delete many items.

To save time working with table item modification, you can add a multi-select option. Users can choose multiple items and apply one of the actions to all of them. For example, delete all of them.

Action buttons

Add action buttons to save the results after the modification of the table. You can make the changes to as many lines as you want and then save all of the changes. Principles of conversation flow design cause this. We expect the user provides us input, and we will know which step to execute inside the conversation flow. When changes are done, the user needs to say if we need to save the changes or not.

Save results with action buttons.

How to use

You can find more information about using this component here.

Next sections to read

Tables with a data comparison view

Compare several data sets in one table.

Lists

Learn more about the lists component.