Low-Code Designer > Widgets > Widget Types / Associated items

Associated items

With the Associated items widget, you can link apps from different workspaces in such a manner that the items of one app are displayed on the page of another app. For example, all the orders made by a customer can be listed on the customer's page, with a link to each order.

Using associated items

Take a look at how the Associated items widget is used in work. Let's say, you have a workspace where all the customers are listed. When a sales rep creates a new order in the Orders app, he or she specifies the customer who placed the order.

On the customer's page, there is an Orders tab. By using the Associated items widget, it displays the links to all orders made by the customer.

00.PNG

There can be a separate tab for each app associated with the Customers app in this manner. The set of tabs can be edited if necessary.

Setting up the Associated Items widget

The Associated items widget can be set in any app. Let's say you have a Projects app that you want to link to the Customers app so that a customer's page shows all the projects that you have done for them. You can set this up in several steps.

Step 1. Add the "Customer" field to the Projects app

Go to the Projects app form, open the advanced edit more, and add a new app type field. Select the Customers app.

01.PNG

Make sure that you have checked the "Search and Sort" box next to this field, otherwise, you will not be able to link the apps.

02.PNG

Step 2.  Add a new tab to the customer's page

Open the Customers' view form for editing in the advanced mode.

Add a new tab by dragging it from the side panel or by clicking on the plus sign+ next to an existing tab. Let's name the tab "Projects".

03.PNG

Step 3. Add the widget and set it up

Drag the Associated items widget to the new tab.

04.PNG

The widget's settings will open. Select the Projects app and mark the fields that you want to be visible on the tab. To do that, click on the plus sign + next to the field's name.

05.PNG

Save the changes. Now the new Projects tab will be added to the customers' page, and it will display all the related projects.

06.PNG

In the editing mode, you can delete unnecessary tabs and move them around. Also, instead of using a separate tab, you can place the widget right on the view form, if that suits you better.

начало внимание

If you delete a project linked to a certain customer, it will also be deleted from the customer's page.

конец внимание