Setting Option Associations

Expected Results

In applications for data entry, queries, and process approvals, associated filters and option limits are often used to maintain data consistency and reduce user errors. For example, in a food ordering application, you can choose coffee or milk tea from the drink category, then you can see specific coffee options (like latte, espresso, caramel macchiato) or milk tea options (like English milk tea, Hong Kong milk tea, bubble tea). On the no-code workbench, you can associate options so that the application shows only the relevant drink options based on your choice. If you choose "Coffee," you will only see coffee options.

Procedure

1. Create a no-code application.
   1. Apply for a free trial or purchase a commercial instance by referring to Authorization of Users for Huawei Cloud Astro Zero Usage and Instance Purchases.
   2. After you have an instance, click Access Homepage on Homepage. The application development page is displayed.
   3. On the top menu bar, click Workbench.
   4. In All Apps, click of Create and select Create Blank App.
   5. Enter an application title (for example, "Ordering"), click Create Form, and select Create Blank Form. The ordering application is displayed.

2. Change the form title to Menu, delete unnecessary widgets, and drag a multi-choice widget from Data Widgets to the canvas.
   Figure 1 Designing a menu form
   

3. Click the single-choice widget to modify its display name and options.
   Figure 2 Setting the single-choice widget
   

4. Set the multi-choice widget.
   1. Click the multi-choice widget and change its display name to Option.
   2. In the Options area, click Add Options.
      Figure 3 Clicking Add Options
      
   3. Add options and click OK.
      Figure 4 Adding options
      

5. Set option associations.
   1. Click Survey Settings on the right.
      Figure 5 Clicking Survey Settings
      
   2. Toggle on Enable option association and click Setting.
      Figure 6 Adding option associations
      
   3. Select the value of the associated field, for example, Coffee under Category, and click OK.

      When this option is selected, the current option "Latte" is displayed on the page.

      Figure 7 Setting associated options
      
   4. Enable Sync to associate other options with the coffee category, as shown in 5.c. For example, associate espresso and caramel macchiato with the coffee category.
      Figure 8 Associating other options
      

      After the synchronization is successful, return to the survey setting page. The values of Set associations are changed to Modify. Click Modify next to Espresso. Its category is changed to Coffee.

      Figure 9 Returning to Survey Settings
      
      Figure 10 Viewing the modified category
      
   5. On the survey setting page, click Setting next to Hong Kong milk tea and set its category to milk tea.
      Figure 11 Setting option associations
      
   6. Enable Sync to add Hong Kong milk tea and Bubble tea to the milk tea category.
      Figure 12 Setting the Hong Kong milk tea and bubble tea categories
      
   7. Click OK to return to the survey setting page.
   8. On the survey setting page, click the confirm button to return to the form design page.

6. Click Save, return to the application development page, share the form, and view the final effect.

   When you click coffee, Figure 13 is displayed. When you click milk tea, Figure 14 is displayed. The effect meets the expectation.

   Figure 13 Viewing the final effect (coffee)
   
   Figure 14 Viewing the final effect (milk tea)