How to load dashboard panels based on dropdown values which should be dependent on submit button?

admin12345678 — Fri, 24 Mar 2023 15:00:24 GMT

Hi,

I have a dashboard where I have a dropdown with three values A, B and C, now if I click on value A it should set panel A, and If I choose value B it should load panel B and same for C also. now that code I have developed but in the dashboard added a submit button and disabled searchwhenchange but still prior to click on submit button panels load automatically after choosing values from the dropdown.

I need help on the submit button it should load panels only after clinking on the submit button.

please find the code below which I have developed.

<form> <label>My Dashboard</label> <fieldset submitButton="true"> <input type="dropdown" token="dropdown_token" searchWhenChanged="false"> <label>dropdown_token</label> <default>A</default> <choice value="A">A</choice> <choice value="B">B</choice> <choice value="C">C</choice> <change> <condition match="'value'=="A""> <set token="panelA">true</set> <unset token="panelB">false</unset> <unset token="panelC">false</unset> </condition> <condition match="'value'=="B""> <unset token="panelA">true</unset> <set token="panelB">false</set> <unset token="panelC">false</unset> </condition> <condition match="'value'=="C""> <unset token="panelA">true</unset> <unset token="panelB">false</unset> <set token="panelC">false</set> </condition> </change> </input> </fieldset> <row> <panel depends="$panelA$"> <table> <title>Panel A</title> <search> <query>index=a |table a b c</query> </search> </table> </panel> <panel depends="$panelB$"> <table> <title>Panel B</title> <search> <query>index=a |table a b c</query> </search> </table> </panel> <panel depends="$panelC$"> <table> <title>Panel C</title> <search> <query>index=a |table a b c</query> </search> </table> </panel> </row> </form>

Re: How to load dashboard panels based on dropdown values which should be dependent on submit button?

Tom_Lundie — Fri, 24 Mar 2023 21:31:01 GMT

In your example, the tokens referenced in the depends= attributes are changing regardless of the submit action. Without using any custom JS; the only way (that I know of) to trigger a token change upon submit, is to use a search.

Here is an example based on your original question that makes use of a | makeresults command which is executed upon submit.

<form> <label>My Dashboard</label> <search> <query>| makeresults | eval panel="$panelToggle$" | fields panel</query> <done> <unset token="panelA"></unset> <unset token="panelB"></unset> <unset token="panelC"></unset> </done> <done> <condition match="$result.panel$=="A""> <set token="panelA"></set> </condition> <condition match="$result.panel$=="B""> <set token="panelB"></set> </condition> <condition match="$result.panel$=="C""> <set token="panelC"></set> </condition> </done> </search> <fieldset submitButton="true" autoRun="false"> <input type="dropdown" token="panelToggle" searchWhenChanged="false"> <label>dropdown_token</label> <choice value="A">A</choice> <choice value="B">B</choice> <choice value="C">C</choice> </input> </fieldset> <search> <query>| makeresults | eval panel="$panelToggle$"</query> <progress> <unset token="panelA"></unset> <unset token="panelB"></unset> <unset token="panelC"></unset> </progress> <done> <condition match="$results.panel$=="A""> <set token="panelA"></set> </condition> <condition match="$results.panel$=="B""> <set token="panelB"></set> </condition> <condition match="$results.panel$=="C""> <set token="panelC"></set> </condition> </done> </search> <row> <panel depends="$panelA$"> <table> <title>Panel A</title> <search depends="$panelA$"> <query>index=a |table a b c</query> </search> </table> </panel> <panel depends="$panelB$"> <table> <title>Panel B</title> <search depends="$panelB$"> <query>index=a |table a b c</query> </search> </table> </panel> <panel depends="$panelC$"> <table> <title>Panel C</title> <search depends="$panelC$"> <query>index=a |table a b c</query> </search> </table> </panel> </row> </form>

(Note the use of depends= for the searches to, to stop the searches from running unnecessarily).

topic How to load dashboard panels based on dropdown values which should be dependent on submit button? in Dashboards & Visualizations

How to load dashboard panels based on dropdown values which should be dependent on submit button?

Re: How to load dashboard panels based on dropdown values which should be dependent on submit button?