Dependent select lists - JSON datasource

Configure the datasource

The first step is to configure the data source, this is easily done. In this documentation, you can either set a local JSON file or a URL data source that return JSON format, the configuration is equivalent in both cases.
Let us say our data are organised in our JSON file as follows:



Create the nFeed fields

Creating the nFeed fields is pretty straightforward and is described here in our documentation. We require 3 nFeed fields:Create the nFeed fields

  • nFeed Standard: Continent

  • nFeed Standard: Country
  • nFeed Standard: City

Configure the Continent selection field

The first select list is simple, it is supposed to fetch all the Continent names. We are going to use the id attribute as the key, so that this value will be used to configure the next select lists.

  • Root element$.continents[*]
  • Columns:
    • First column → Nameid JSON path$.id
    • Second column → Namecontinent_name JSON path$.continent_name
  • Key(this number refers to the id attribute). You can find more information about how to configure the edit view here.
  • EditorSelect list
  • Selection: The user can select only one value
  • Columns: 1
  • Template{1}

Configure the Country nFeed field

The values that are displayed in the Country field needs to be different depending on what value is selected in the Continent field. The JSON file table contains an attribute that will be useful to determine whether the value must be displayed. The continent_id attribute (in the countries array) contains the id of the corresponding continent. That attribute must match the continent that has been selected

    • Root element$.countries[?(@.continent_id==$issue.get("Continent"))]
    • Columns:
      • First column → Nameid JSON path$.id
      • Second column → Namecountry_name JSON path$.country_name
    • Key0
    • EditorSelect list
    • Selection: The user can select only one value
    • Columns: 1
    • Template{1}

Configure the City nFeed field

Almost done, finally the City field. The configuration here is very similar to the previous one, except that here we are going to match the country_id attribute with the value that has been selected in the Country field.

  • Root element$.cities[?(@.country_id==$issue.get("Country"))]
  • Columns:
    • First column → Nameid JSON path$.id
    • Second column → Namecity_name JSON path$.city_name
  • Key0
  • EditorSelect list
  • Selection: The user can select only one value
  • Columns: 1
  • Template{1}

Multiple value dependent fields

And what if Country field is a multiple value field? If, for example, we select Iceland and Australia, could we propose all the cities from those two countries in the City nFeed field? The answer is OF COURSE.

Configure the Country nFeed field

Country field configuration is the same as in the example above, you should just choose 'Multiple value' selection option.

Configure the City nFeed field

Here the configuration is almost the same as above, exact that Root element filter will be a little bit different. Since $issue.get("Country") will now return a list of selected country ids, we should transform it to a list.

  • Root element: $.cities[?(@.country_id in [$issue.get("Country").stringList()])]