Async data fetch for cascading dropdownlist

1 Answer 67 Views
DropDownList
MITHUN
Top achievements
Rank 1
MITHUN asked on 26 Nov 2021, 10:28 AM
I am trying to implement 2 cascading dropdown where one is dependent on the other. To populate the dropdownlist I am calling 2 apis. The first one is for the parent dropdown and the second one will return data based on data selected in the parent dropdown. But now due to async call of the 2nd api the onChange function is getting hit beforehand. How to solve this?

1 Answer, 1 is accepted

Sort by
0
Filip
Telerik team
answered on 30 Nov 2021, 07:17 AM

Hello, Mithun,

It is normal for the onChange function to be fired earlier, because of the nature of async calls, but it is possible to wait inside the OnChange handler for the async call to end and then perform the update logic, similar to this code snippet:

 

secondOnChange = (e) => {
    makeAsyncApiCall();
  // when the call is completed then make update
  setOtherDropDownValue(e.value)
}

 

In case you are experiencing any difficulties with this approach or it does not help you, please provide a runnable example with your code so that we can assist further.

Regards, FilipProgress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tags
DropDownList
Asked by
MITHUN
Top achievements
Rank 1
Answers by
Filip
Telerik team
Share this question
or