Skip to Content

Linking Dropdown lists in Visual Composer 7.0


Let us assume that you have a VC model in which you want to include an input form with 4 dropdown lists (Hemisphere, country, state and city) and based on these dropdowns you want to filter the data in your report. All these dropdowns will have a dynamic entry list and are created using a BW Query. These four dropdowns are linked to each other such that when user chooses Easter Hemisphere in first dropdown i.e. Hemisphere, the second dropdown Country should show values corresponding to Eastern Hemisphere and next dropdown state should show values corresponding to selected country.

Input Form.JPG


Following is the step by step solution for the above requirement.

  1. Create a BW query and include all the characteristics for which you want to create dropdowns.

In this case we need to include Hemisphere, Country, State and City.


     2. In your VC Model create an input form and add four input fields and configure them as dropdowns (i.e. Hemisphere, Country, State and City).

       Input Form.JPG

     3. We have BW query and dropdowns in place, next steps are to create dynamic entry list and link these dropdowns to each other.

Creation of entry list for the dropdowns and linking of these dropdowns are explained in detail in the following sections.

Entry list for Hemisphere:

Select control properties for Hemisphere and click on Entry List tab.


As Hemisphere has only two possible values let us make it static and add values manually as shown in the following screenshot.

Hemisphere Entry List.JPG

Entry list for Country:

In the Entry List for country select Dynamic for List Scope and click on the “Find Data Services” button. In this case Data service is BW Query.

Find Data Services.JPG

In the subsequent popup screen, select “Look for a query” search for the query which we have created initially. Select input port and output port as shown in the screenshot below and click Ok.

Pop up.JPG

In order to link Hemisphere and country, we need to assign the value of Hemisphere as input to Country. Assignment of Hemisphere value as input to data service is shown in the following screenshot.

City Link.JPG

In the output port we can define the format of the value that should be passed to the query and the text that we want to display in the dropdown (i.e. Key or Text).

With the above step we have completed the linking of Hemisphere and Country, now let us link State to Country.

Entry List for state:

Entry list for state is similar to that of Entry list for County except for the last step i.e. assignment of Hemisphere and Country values as input to the data service to retrieve the list of States for the values of Hemisphere and Country. Following screenshot portraits the assignment of input and output values for the Data service.

State link.JPG

Entry List for City:

Entry list for City is similar to the entry list for state; only difference is the assignment of input and output to the data source. For city we need to assign County and State as input and city as output, this assignment is shown in the following screenshot.

City Link.JPG

Following are the screenshots of the Input Form and the linked dropdown boxes after the above configurations:

From the Below screenshots we can observe that dropdown for country contains only those countries which come under Eastern Hemisphere and values in the dropdown for State are restricted to states from India only.

Countries EH.JPG

States EH.JPG

Similarly for Western Hemisphere only US is available in dropdown for country and only US states are available for selection in the dropdown for state.

Countries WH.JPG

States WH.JPG


Be the first to leave a comment
You must be Logged on to comment or reply to a post.