How to Fetch data from data resource using dropdown list?

I have app data resource that has .name and .number. I have dropdown list of those names. How to fetch the number from data resource to input field based on dropdown list entry? Ie. data.number
Jack 55
Jill 38
Jim 19

From dropdown I pick “Jack” and there should be “55” in input field. How to do it?

1 Like

You can bind Selected value of the dropdown to some other variable (e.g. page variable) and bind the input field also to this variable. The input field value should then change based on dropdown selection.

If you want to modify the value in the input field, note that it has two-way binding which means it would modify the selected value of dropdown also. If you just want to have the initial value from dropdown to the input field and then continue only in the input field, you could try using Receive event with Event source “Page variable ‘selected_dropdown_value’ changed”. Then after the event was triggered, use Set page variable to set another page variable e.g. input_field_value to be same as selected_dropdown_value

@Tomi_Laakso The value isn’t shown in dropdown, only the names are. I pick the name from dropdown list and I need the value bound to that name. If I select “Jack” ( to dropdown I need to see “55” (data.number) in input field. If your suggestion works that way you need to clarify it a bit.

Later on I use the number “55” as a base for calculations. I will multiply it, show the result in input field and save the result to other data record. I think I will figure out how that works if I learn how to get the number bound to name from data record.

Okay, if I understood correctly you have dropdown option list set and dropdown offers options and you have bound Selected value to some dropdown_value variable. Then try using Receive event with Event source “Page variable ‘dropdown_value’ changed”. When the value changes, then use formulas FIND_BY_KEY(…) and LOOKUP(…) to Set page variable that you have bound to the input field.

With these formulas you’ll basically first find the correct object in your data array and then lookup for the value of correct data.number.

Formula should look something like: LOOKUP(FIND_BY_KEY(data, "name", dropdown_value), "number")

I understood something buttoo little to try to get it working. I tried anyhow :slight_smile: I have bound the dropdown_value “name” to page variable “who”. I haven’t bound any other variables yet.

try using Receive event with Event source “Page variable ‘dropdown_value’ changed”.

What? Should I add Receive event to dropdown or input field? If to input field how to set Event source to “page variable ‘dropdown_value’ changed”? Where to put the formula?

Let’s see if I can clarify this a little

  • Dropdown component:
    • Define Option list with correct labels and values
    • Bind Selected value to page variable dropdown_value
  • Input component:
    • Bind Value to page variable input_value
  • Page logic:
    • Add Receive event and change its source to “page variable ‘dropdown_value’ changed”
      • After the event is triggered, use Set page variable to set input_value to be LOOKUP(FIND_BY_KEY(data, "name", dropdown_value), "number")

So basically the answer is to add the event to page logic and not to either component to make the logic clearer to follow. You might of course need to check that variable names are correct etc to fit your app.

1 Like

Thank you @Tomi_Laakso! Now it is really easy to follow :slight_smile: I haven’t realized one can add logic to page. Now I know.

One thing. I can’t find event source “page variable…changed”. “Fired from ‘Trigger event’” is nearest option to that.

Do you have the page variable added to same page as the event? If the event and page variable are on different pages, you won’t see the page variable in that dropdown

Sure. “Param.what”. ID 96981

You have defined a Page parameter instead of a Page variable. So, just define the variable to correct place and all should work (and remove the unnecessary parameter).

(Page parameters are used to pass information to newly opened page from the old page.)

LoL :smiley: and I double and triple check everything before posting :smiley: Thank you!

Hi Guys, I think I have a related challenge but now with text input instead of dropdown. I need my page variable to change when input value changes but I dont seem to be able to access the page variable from here.

What I am missing?

Hi, Page variables are not available inside the isolation mode. This means your approach has to change a little to achieve the desired result.

Let’s say your Input field value is bound to Page variable input_value and the Page variable that you want to change based on input_value change is second_variable.

  1. You should just bind input_value to Input field value property as usual.
  2. Drag a new Receive event Flow function to the Page level logic canvas.
  3. Change Receive event’s Event source to Page variable 'input_value' changed.
  4. Connect Set page variable Flow function to the Receive event and use it on second_variable.

Note: input_value will change after each letter user types so the event will trigger many times. If you don’t want that to happen, you can add a Debounce or Throttle Flow function right after the Receive event to limit the times the logic is executed. (Though if the logic is just setting a Page variable, there’s no need for this)

1 Like