Ability to set separate display name and stored value in dropdown control

[rishikeshjadhav]

I am using survey-angular package version 1.1.26

I am trying to use choicesByUrl property for dropdown field to fetch choices from API.

Below is the code snippet for the same,

    {
                "type": "dropdown",
                "name": "country",
                "title": "Country",
                "isRequired": true,
                "choicesByUrl": {
                  "url": "http://localhost:4000/api/country",
                  "valueName": "name"
                },
                "choicesOrder": "asc"
              },
              {
                "type": "dropdown",
                "name": "region",
                "title": "Region",
                "isRequired": true,
                "choicesByUrl": {
                  "url": "http://localhost:4000/api/country/{country}",
                  "valueName": "name"
                },
                "choicesOrder": "asc"
              }

I have two dropdowns, 1. Country 2. Region

I want to fetch Region based on selected country

My country and region are stored in below format in backend

Country JSON:

[
{
"id": 1
"name": "country1"
},
{
"id": 2
"name": "country2"
}
]

Region JSON:

[
{
"id": 1
"name": "region1"
"countryId": 1
},
{
"id": 2
"name": "region2"
"countryId": 2
}
]

I am correctly getting the values in Country dropdown from API and on selecting the country an API call is triggered to fetch the related regions.

I want to check if we can set the display value in the country dropdown as country name and store country id as value, so that the regions can be fetched using country id?

[rishikeshjadhav]

Got this working with below properties under choicesByUrl,

"titleName": "name",
"valueName": "id"

Closing the issue.