[SOLVED] Dropdown - bind `value` attribute different to display text?


I’m working on binding an API connector’s response with a structure similar to this to a dropdown controller:

    "id": 1,
    "name": "Some display value"

My goal would be to have Drona generate the following-ish HTML structure based on the above response:

  <!-- For-each element in the response array, generate an option -->
  <option value={{response.id}}> {{response.name}} </option>

When the user selects a given option, I’m only interested in binding or retrieving the value of the value attribute (id), not the display text (name) itself.

How would I go about setting up my dropdown controller to support this?
After a few hours of failed attempts (binding name to option and id to selected option, some custom JS, etc.,), nothing seem to fully support what I want achieved.

(I’m a frontend dev by trade assessing low-/no-code solutions, so don’t skimp on the technical details if necessary!)

OK, so I think I managed to solve this. For future reference, there is an option on the Dropdown controller to specify which “column” (property) is used for the display data (text) and which is used for the value attribute. Both input fields are numeric, so it wasn’t immediately obvious to me that these correlate to the order of the “Selected keys” in the API connector bindings panel.