Dependent/Cascading List Of Values (LOV) in VBCS
This article shows how to create a Dependent/Cascading List Of Values (LOV) in VBCS. When you have a drop-down whose values depend on another drop-down then, in this case, you can create a cascading List Of Values (LOV).
For example, select the Oracle Office country from first LOV and populate city into second LOV based on the Country selected. The second LOV values are dependent on the first LOV. This is called the Dependent/Cascading List Of Values (LOV).
Some Important Articles
Basics of Oracle Visual Builder Cloud Services
Create a simple web application: Visual Builder Cloud Service(VBCS)
See the short video on the same topic
Download the project from here
Let’s go and see how to create a Dependent/Cascading List Of Values (LOV).
First, create two business object to hold country and city values
Create a web application
First, create a VBCS application “LOVApplication” and a web application with the name “oracleofficewebapp“.
Business Objects
Create two Business Object as below:
| Business Object | Columns | Type |
| Country | 1) name | string |
| City | 1) name 2) ref2country |
string reference(Country) |
Country Object
City Object
Create List Of Values
Open the web-application ” oracleofficewebapp” and drop below control
| Control Name | Label |
| Heading | Oracle Offices |
| Single Select | Country |
| Single Select | City |
Select Country LOV and select Quick Start from the right property pallet. Click on Add Options
Select Country Business Object from Add Options wizard and click on the Next button
On the next screen, drop the name from the left panel on Label and id on Value and select Next and finish the wizard
Now Select City LOV and select Quick Start from the right property pallet. Click on Add Options. From the opened wizard select City Business Object and select the Next button. On the next screen, drop the name from left pane and id on Value and select Next and finish the wizard
Now, select Country LOV, click the Events tab, select + New Event and click Quick Start: ‘value’ event
Drop, Assign Variables activity from Actions on the event chain. Click on the Assign from right
In the target panel, expand Page -> cityListSDP and select filterCriterion and then click on Click to add condition
In the IF select ref2country (this is City Business Object column name), select equals as an operator and select $chain.variables.value as a value
Click on the cityListSDP and see the generated code. Click on the Save button to close the wizard
{
"filterCriterion": {
"op": "$eq",
"attribute": "ref2country",
"value": "{{ $chain.variables.value }}"
}
}This is the only configuration which is required to create Dependent/Cascading LOVs
Test the LOVs
Click on the Run icon from the top to run the application. Select India as Country and see the matching City should be populated
Now select the United State as a country and then corresponding City should be populated
