topic . in Dashboards & Visualizations

.

iegus — Wed, 15 Mar 2023 16:09:45 GMT

Re: How to dynamically show/hide a dashboard panel based on drop-down selection?

michael_bates_1 — Wed, 15 Mar 2023 01:17:29 GMT

Hi there.
It looks like you dropdown logic is correct.
Set a token to display the panel, unset token to hide the panel.
To display all, simply set all tokens.
For each panel you want to hide/show, ensure you have something similar to the following

You would have a token for each of the elements you want to conditionally display; table, single, and graph.

with the required elements in them

Re: How to dynamically show/hide a dashboard panel based on drop-down selection?

iegus — Wed, 15 Mar 2023 01:27:28 GMT

Could you show me how I can include the codes you sent and how it would look?

Re: How to dynamically show/hide a dashboard panel based on drop-down selection?

michael_bates_1 — Wed, 15 Mar 2023 01:50:24 GMT

Hi, here is a working skeleton that shows the concept.

<form version="1.1"> <label>Sample Dropdown Selector</label> <fieldset submitButton="false"> <input type="dropdown" token="select"> <label>select</label> <choice value="All">All</choice> <choice value="Table">Table</choice> <choice value="Single">Single</choice> <choice value="Graph">Graph</choice> <choice value="None">None</choice> <default>None</default> <initialValue>None</initialValue> <change> <condition value="All"> <set token="Table"></set> <set token="Graph"></set> <set token="Single"></set> </condition> <condition value="Table"> <unset token="Single"></unset> <unset token="Graph"></unset> <set token="Table"></set> </condition> <condition value="Graph"> <unset token="Table"></unset> <unset token="Single"></unset> <set token="Graph"></set> </condition> <condition value="Single"> <unset token="Table"></unset> <set token="Single"></set> <unset token="Graph"></unset> </condition> <condition value="None"> <unset token="Table"></unset> <unset token="Single"></unset> <unset token="Graph"></unset> </condition> </change> </input> </fieldset> <row> <panel depends="$Table$"> <title>Table</title> <table> <search> <query>| makeresults count=10 | streamstats count | eval title="Item "+count</query> <earliest>-24h@h</earliest> <latest>now</latest> </search> <option name="drilldown">none</option> <option name="refresh.display">progressbar</option> </table> </panel> <panel depends="$Single$"> <title>Single</title> <single> <search> <query>| makeresults count=10 | streamstats count</query> <earliest>-24h@h</earliest> <latest>now</latest> </search> <option name="drilldown">none</option> </single> </panel> <panel depends="$Graph$"> <title>Graph</title> <chart> <search> <query>| makeresults count=10 | streamstats count</query> <earliest>-24h@h</earliest> <latest>now</latest> </search> <option name="charting.chart">line</option> <option name="charting.drilldown">none</option> </chart> </panel> </row> </form>

Re: How to dynamically show/hide a dashboard panel based on drop-down selection?

gcusello — Wed, 15 Mar 2023 05:52:52 GMT

Hi @iegus ,

the answer from @michael_bates_1 is correct,

in addition, you could see in the Splunk Dashboard Examples app (https://splunkbase.splunk.com/app/1603) where you can find an example and the description about your requirement.

Ciao.

Giuseppe

Re: How to dynamically show/hide a dashboard panel based on drop-down selection?

bowesmana — Wed, 15 Mar 2023 06:22:45 GMT

There are a couple of issues with your existing statements in that you are using $value$ in the condition and looking for "Todos", which is actually $label$ and not the value, which you have set to *.

It's not clear if you need the $Select$ token for the input to be the value of the input, but on the basis that you are using the $Select$ token elsewhere, you can get rid of the condition statements and use a simple set of eval statements for your token setters.

The example below only needs 2 <eval> token statements to set the pane dependent tokens. Setting a token to null() is the same as unsetting it, so you don't need <condition>.

Note the use of $value$ and $label$ in the eval as it's tricky to compare a value of "*" which is the value of the Todos option.

<form> <label>tmp11</label> <row> <panel> <input type="dropdown" token="Select"> <label>Select</label> <choice value="*">Todos</choice> <choice value="Tabela">Tabela</choice> <choice value="Gráfico">Gráfico</choice> <default>Todos</default> <change> <eval token="Tabela">if($value$="Tabela" OR $label$="Todos", "", null())</eval> <eval token="Gráfico">if($value$="Gráfico" OR $label$="Todos", "", null())</eval> </change> </input> </panel> <panel depends="$Gráfico$"> <html> <h1>Gráfico</h1> <p>Select token is $Select$</p> </html> </panel> <panel depends="$Tabela$"> <html> <h1>Tabela</h1> <p>Select token is $Select$</p> </html> </panel> </row> </form>