UI Builder dropdown over an external API request

[Teo Gamarra]

I'm trying to create a dynamic dropdown, similar to Country-State-City logic. I have implemented this process logic before using vanilla JS where the selected ID is captured and sent to the following method as variable. Since I'm using ServiceNow services and UI Builder, I have to follow SN's structure. Here is how I've managed to build it so far. 

The data from the dropdowns are coming from external api requests, therefore I'm using Transform - Data Brokers (data resources) for UI Builder in order to follow SN best practices. I'm able to get the data in the 'List Items' for the first dropdown however can't seem to find an event listener to get the id selected and send it back to the second Transform Data Broker programProfiles (dropdown). I have read I should use the 'Events' tab however I'm not familiar yet with this logic.

1. Should the 'Event' selected be over the data resource or over the component? If so what should be the 'Event Handler' for this scenario ?

2. Is using an Event the ideal way ?

[Hasan6]

Hi eberteo,

Did you try the dropdown item clicked event?

It should do the trick.

Also, do let me know if it doesn't, and we'll explore otherwise.

Best

Hasan

[Teo Gamarra]

Hasan. Any idea why the "When to evaluate this data resource" field has only the "Only when invoked (explicit)" option available. What's up with the "Immediately eager" option? I have set no events at all. This is a different page. UI Builder has a rare behavior over certain actions. Cleared cache

[Teo Gamarra]

Hasam! Any idea why the "When to evaluate this data resource" field has only the "Only when invoked (explicit)" option available. What's up with the "Immediately eager" option ? I have set no events at all.

[Hasan6 · Accepted solution]

Hi Eberteo,

I hope the Dropdown item clicked solution worked.

Now, coming to the data broker trigger question you asked.

Firstly, can you confirm if this is a custom transform data broker?

I wager "yes."

Regardless of the answer, you are not getting the Immediately Eager option as the Mutates Server Data checkbox in the data broker is checked.

Mutates Server Data should be unchecked for all data brokers where you are not mutating, ie, reading the data.

If this is a custom data broker, and you are not creating/updating/deleting any record, then freely uncheck the checkbox and your issue should be resolved.

But if data is being modified, I highly recommend keeping it checked and triggering it manually through events. Otherwise there will be rogue invocations of the data broker, triggering multiple creations/updations/deletions of the record.

Hope this helps!

Best

Hasan