UI Builder: How do I pass a data visualizations query to a list component?

[Jacob Saaby Nie]

So I have this dashboard page in UI builder.

On it I have 5 data visualizations.

1 is a donut type.

4 are just single scores.

Below that I have a simple list.

What I want to happen is when I click on a value in the donut, or on a single score, the lists filter changes to that of the data visualization.

I've gotton so far that I'm binding state parameters etc.

But how on earth do I pass the data visualizations filter to the list component, so it updates dynamically?

Does that filter have a name, e.g. @payload.filter  or something like that?

[Jacob Saaby Nie]

Thanks @kaushal_snow !

Now I know a little more. Been trying this out. 

I see how using data visualizations directly on the page makes the various params and data pills visible.

However, I would like for the data visualizations to be the first row.

And then the list just below the data visualizations.

And when something is clicked in the data visualization, the list should update to reflect the new query data.

[JeremyHoffman]

Hi @Jacob Saaby Nie,

I know this is a really old post - not sure if you figured out a solution yet. I have (well had) the exact same issue - 4 single score data visualizations (using a repeater) and wanted a simple list to update based on clicking one of the single scores.

I was able to get this working in UI Builder using the List Controller → Set Query event response. I have multiple Single Score Data Visualizations within a Visualization Repeater and a Connected List on the same page. On the Single Score Data Visualization component, I added an event mapping with Visualization Clicked as the trigger and List Controller → Set Query as the response. In the response configuration, I selected Script and used the following:

function evaluateEvent({api, event}) {
    return {
        encodedQuery: event.payload.params.query
    };
}

This passes the selected visualization's encoded query directly to the List Controller, dynamically filtering the Connected List without navigating to another page. No client script or client state parameter is required for the drill-down itself.

I do use a separate client state parameter (queueFilter) initialized to sys_idISEMPTY and bound to the list's Default filter, so the list starts empty when the page loads. Once a visualization is clicked, the List Controller's Set Query response updates the displayed records. This also works with dynamically generated visualizations in a Visualization Repeater.

I hope this helps!

Jeremy