Dashboards & Visualizations

How to make panel depend on token value?

matstap
Communicator

I have 10 panels on a dashboard. I want to have a dropdown menu to select which panel to see (hiding the rest). Say this dropdown has a token called panel_tok. Is there a way to make the panels depend on specific values of panel_tok?

i.e., if I select "A" in the dropdown, only panel "A" should be visible.

1 Solution

niketn
Legend

@matstap, following are couple of options you have! Try the run anywhere dashboard examples.

Option 1: set only one depends token on selection of the corresponding panel. At the same time the tokens for other panels should be unset. You would also need to add a dependency of the token being set to specific Panel's Search query so that it runs only when the token is set. This is required since you one to run only 1 search when the dashboard loads, not 10.

    <form>
      <label>Option 1: Dropdown to Show Specific Panel and Hide Others</label>
      <fieldset submitButton="false">
        <input type="dropdown" token="tokShowHidePanel" searchWhenChanged="true">
          <label>Display Panel</label>
          <choice value="panelA">Panel A</choice>
          <choice value="panelB">Panel B</choice>
          <choice value="panelC">Panel C</choice>
          <default>panelA</default>
          <change>
            <condition value="panelA">
              <set token="tokShowPanelA">true</set>
              <unset token="tokShowPanelB"></unset>
              <unset token="tokShowPanelC"></unset>
            </condition>
            <condition value="panelB">
              <unset token="tokShowPanelA"></unset>
              <set token="tokShowPanelB">true</set>
              <unset token="tokShowPanelC"></unset>
            </condition>
            <condition value="panelC">
              <unset token="tokShowPanelA"></unset>
              <unset token="tokShowPanelB"></unset>
              <set token="tokShowPanelC">true</set>
            </condition>
          </change>
        </input>
        <input type="time" token="tokTime" searchWhenChanged="true">
          <label></label>
          <default>
            <earliest>-24h@h</earliest>
            <latest>now</latest>
          </default>
        </input>
      </fieldset>
      <row>
        <panel depends="$tokShowPanelA$">
          <title>Panel A - INFO</title>
          <chart>
            <search>
              <query>index=_internal sourcetype=splunkd log_level="INFO"
    | timechart count by component useother=f usenull=f limit=5
    | eval dummy="$tokShowPanelA$"
    | fields - "$tokShowPanelA$"</query>
              <earliest>$tokTime.earliest$</earliest>
              <latest>$tokTime.latest$</latest>
            </search>
            <option name="charting.chart">area</option>
            <option name="charting.drilldown">all</option>
            <option name="refresh.display">progressbar</option>
          </chart>
        </panel>
        <panel depends="$tokShowPanelB$">
          <title>Panel B - WARN</title>
          <chart>
            <search>
              <query>index=_internal sourcetype=splunkd log_level="WARN"
    | timechart count by component useother=f usenull=f limit=5
    | eval dummy="$tokShowPanelB$"
    | fields - "$tokShowPanelB$"</query>
              <earliest>$tokTime.earliest$</earliest>
              <latest>$tokTime.latest$</latest>
            </search>
            <option name="charting.chart">area</option>
            <option name="charting.drilldown">all</option>
            <option name="refresh.display">progressbar</option>
          </chart>
        </panel>
        <panel depends="$tokShowPanelC$">
          <title>Panel C - ERROR</title>
          <chart>
            <search>
              <query>index=_internal sourcetype=splunkd log_level="ERROR"
    | timechart count by component useother=f usenull=f limit=5
    | eval dummy="$tokShowPanelC$"
    | fields - "$tokShowPanelC$"</query>
              <earliest>$tokTime.earliest$</earliest>
              <latest>$tokTime.latest$</latest>
            </search>
            <option name="charting.chart">area</option>
            <option name="charting.drilldown">all</option>
            <option name="refresh.display">progressbar</option>
          </chart>
        </panel>
      </row>
    </form>

Option 2:
Set the Query to be run in Specific Panel in the dropdown change event handler. Keep only one panel and run the specific query.

<form>
  <label>Option 2: Dropdown to Show Specific Panel and Hide Others</label>
  <fieldset submitButton="false">
    <input type="dropdown" token="tokShowHidePanel" searchWhenChanged="true">
      <label>Display Panel</label>
      <choice value="panelA">Panel A - INFO</choice>
      <choice value="panelB">Panel B - WARN</choice>
      <choice value="panelC">Panel C - ERROR</choice>
      <default>panelA</default>
      <change>
        <condition value="panelA">
          <set token="tokShowPanelQuery">index=_internal sourcetype=splunkd log_level=&quot;INFO&quot;| timechart count by component useother=f usenull=f limit=5</set>
          <set token="tokPanelTitle">$label$</set>
        </condition>
        <condition value="panelB">
          <set token="tokShowPanelQuery">index=_internal sourcetype=splunkd log_level=&quot;WARN&quot;| timechart count by component useother=f usenull=f limit=5</set>
          <set token="tokPanelTitle">$label$</set>
        </condition>
        <condition value="panelC">
          <set token="tokShowPanelQuery">index=_internal sourcetype=splunkd log_level=&quot;ERROR&quot;| timechart count by component useother=f usenull=f limit=5</set>
          <set token="tokPanelTitle">$label$</set>
        </condition>
      </change>
    </input>
    <input type="time" token="tokTime" searchWhenChanged="true">
      <label></label>
      <default>
        <earliest>-24h@h</earliest>
        <latest>now</latest>
      </default>
    </input>
  </fieldset>
  <row>
    <panel depends="$tokPanelTitle$">
      <title>$tokPanelTitle$</title>
      <chart>
        <search>
          <query>$tokShowPanelQuery$</query>
          <earliest>$tokTime.earliest$</earliest>
          <latest>$tokTime.latest$</latest>
        </search>
        <option name="charting.chart">area</option>
        <option name="charting.drilldown">all</option>
        <option name="refresh.display">progressbar</option>
      </chart>
    </panel>
  </row>
</form>

PS: I have used three Panels/Queries for Run anywhere Example, but you can extend to the 10 that you need.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

carbdb
Explorer

my recent experience in having  chained searches depending on token:

<search id="s1" base="mybasesearch" depends="$run$">

<query>| eval run="$run$"

...</query>

</search>

<search base="s1">...</search>

0 Karma

TheEggi98
Path Finder

Not the most recent Topic, but it got shown first, so i'll post my approach here.

Recently i had similar difficulties and ended up  with a solution with way less lines and without much <set> ans <unset>

Dropdown:

<input type="dropdown" token="dropdownTok" searchWhenChanged="true">
      <label>dropdown</label>
      <choice value="all">All</choice>
      <choice value="1">Entry1</choice>
      <choice value="2">Entry2</choice>
      <choice value="3">Entry3</choice>
      <choice value="4">Entry4</choice>
      <change>
        <eval token="DisplayPanel1">if($value$="1",true(),if($value$="all",true(),null()))</eval>
        <eval token="DisplayPanel2">if($value$="2",true(),if($value$="all",true(),null()))</eval>
        <eval token="DisplayPanel3">if($value$="3",true(),if($value$="all",true(),null()))</eval>
        <eval token="DisplayPanel4">if($value$="4",true(),if($value$="all",true(),null()))</eval>
      </change>
      <default>all</default>
    </input>

That couple of lines inside <change> allows to set/unset the Tokens without <condition>
I simply can u8se depends="$DisplayPanel2$" and that Row/Panel only shows up when all or Entry2 is selected


tomapatan
Communicator

great answer, was very useful, thanks.

0 Karma

matthaeus
Explorer

Hey there, I'm trying to implement this into one of my dashboards but have run into a problem.

I've implemented the option 2 and it works really well so far. However I would like to be able to not only select an option in the dropdown, but also by clicking on a value in another panel. And while I've implemented the drilldown, and the selected value shows up in my dropdown, the corresponding search is not getting executed. Instead the selected value is just getting added in the dropdown list although the same value is already existing.
Could anyone help me out here?

0 Karma

niketn
Legend

@matstap, following are couple of options you have! Try the run anywhere dashboard examples.

Option 1: set only one depends token on selection of the corresponding panel. At the same time the tokens for other panels should be unset. You would also need to add a dependency of the token being set to specific Panel's Search query so that it runs only when the token is set. This is required since you one to run only 1 search when the dashboard loads, not 10.

    <form>
      <label>Option 1: Dropdown to Show Specific Panel and Hide Others</label>
      <fieldset submitButton="false">
        <input type="dropdown" token="tokShowHidePanel" searchWhenChanged="true">
          <label>Display Panel</label>
          <choice value="panelA">Panel A</choice>
          <choice value="panelB">Panel B</choice>
          <choice value="panelC">Panel C</choice>
          <default>panelA</default>
          <change>
            <condition value="panelA">
              <set token="tokShowPanelA">true</set>
              <unset token="tokShowPanelB"></unset>
              <unset token="tokShowPanelC"></unset>
            </condition>
            <condition value="panelB">
              <unset token="tokShowPanelA"></unset>
              <set token="tokShowPanelB">true</set>
              <unset token="tokShowPanelC"></unset>
            </condition>
            <condition value="panelC">
              <unset token="tokShowPanelA"></unset>
              <unset token="tokShowPanelB"></unset>
              <set token="tokShowPanelC">true</set>
            </condition>
          </change>
        </input>
        <input type="time" token="tokTime" searchWhenChanged="true">
          <label></label>
          <default>
            <earliest>-24h@h</earliest>
            <latest>now</latest>
          </default>
        </input>
      </fieldset>
      <row>
        <panel depends="$tokShowPanelA$">
          <title>Panel A - INFO</title>
          <chart>
            <search>
              <query>index=_internal sourcetype=splunkd log_level="INFO"
    | timechart count by component useother=f usenull=f limit=5
    | eval dummy="$tokShowPanelA$"
    | fields - "$tokShowPanelA$"</query>
              <earliest>$tokTime.earliest$</earliest>
              <latest>$tokTime.latest$</latest>
            </search>
            <option name="charting.chart">area</option>
            <option name="charting.drilldown">all</option>
            <option name="refresh.display">progressbar</option>
          </chart>
        </panel>
        <panel depends="$tokShowPanelB$">
          <title>Panel B - WARN</title>
          <chart>
            <search>
              <query>index=_internal sourcetype=splunkd log_level="WARN"
    | timechart count by component useother=f usenull=f limit=5
    | eval dummy="$tokShowPanelB$"
    | fields - "$tokShowPanelB$"</query>
              <earliest>$tokTime.earliest$</earliest>
              <latest>$tokTime.latest$</latest>
            </search>
            <option name="charting.chart">area</option>
            <option name="charting.drilldown">all</option>
            <option name="refresh.display">progressbar</option>
          </chart>
        </panel>
        <panel depends="$tokShowPanelC$">
          <title>Panel C - ERROR</title>
          <chart>
            <search>
              <query>index=_internal sourcetype=splunkd log_level="ERROR"
    | timechart count by component useother=f usenull=f limit=5
    | eval dummy="$tokShowPanelC$"
    | fields - "$tokShowPanelC$"</query>
              <earliest>$tokTime.earliest$</earliest>
              <latest>$tokTime.latest$</latest>
            </search>
            <option name="charting.chart">area</option>
            <option name="charting.drilldown">all</option>
            <option name="refresh.display">progressbar</option>
          </chart>
        </panel>
      </row>
    </form>

Option 2:
Set the Query to be run in Specific Panel in the dropdown change event handler. Keep only one panel and run the specific query.

<form>
  <label>Option 2: Dropdown to Show Specific Panel and Hide Others</label>
  <fieldset submitButton="false">
    <input type="dropdown" token="tokShowHidePanel" searchWhenChanged="true">
      <label>Display Panel</label>
      <choice value="panelA">Panel A - INFO</choice>
      <choice value="panelB">Panel B - WARN</choice>
      <choice value="panelC">Panel C - ERROR</choice>
      <default>panelA</default>
      <change>
        <condition value="panelA">
          <set token="tokShowPanelQuery">index=_internal sourcetype=splunkd log_level=&quot;INFO&quot;| timechart count by component useother=f usenull=f limit=5</set>
          <set token="tokPanelTitle">$label$</set>
        </condition>
        <condition value="panelB">
          <set token="tokShowPanelQuery">index=_internal sourcetype=splunkd log_level=&quot;WARN&quot;| timechart count by component useother=f usenull=f limit=5</set>
          <set token="tokPanelTitle">$label$</set>
        </condition>
        <condition value="panelC">
          <set token="tokShowPanelQuery">index=_internal sourcetype=splunkd log_level=&quot;ERROR&quot;| timechart count by component useother=f usenull=f limit=5</set>
          <set token="tokPanelTitle">$label$</set>
        </condition>
      </change>
    </input>
    <input type="time" token="tokTime" searchWhenChanged="true">
      <label></label>
      <default>
        <earliest>-24h@h</earliest>
        <latest>now</latest>
      </default>
    </input>
  </fieldset>
  <row>
    <panel depends="$tokPanelTitle$">
      <title>$tokPanelTitle$</title>
      <chart>
        <search>
          <query>$tokShowPanelQuery$</query>
          <earliest>$tokTime.earliest$</earliest>
          <latest>$tokTime.latest$</latest>
        </search>
        <option name="charting.chart">area</option>
        <option name="charting.drilldown">all</option>
        <option name="refresh.display">progressbar</option>
      </chart>
    </panel>
  </row>
</form>

PS: I have used three Panels/Queries for Run anywhere Example, but you can extend to the 10 that you need.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

annisha26
Explorer

hi @niketn ,

I want to be able show more than one pannel at time Using a multiselect or check box is there any solution for this. 

 

0 Karma

TheEggi98
Path Finder

@annisha26 
You can easily do that with the following:

 <input type="multiselect" token="panelTok" searchWhenChanged="true">
      <label>select Panels to show</label>
      <choice value="1">Entry1</choice>
      <choice value="2">Entry2</choice>
      <choice value="3">Entry3</choice>
      <choice value="4">Entry4</choice>
      <change>
        <eval token="DisplayPanel1">if(isnull(mvfind($panelTok$, "1")),null(),true())</eval>
        <eval token="DisplayPanel2">if(isnull(mvfind($panelTok$, "2")),null(),true())</eval>
        <eval token="DisplayPanel3">if(isnull(mvfind($panelTok$, "3")),null(),true())</eval>
        <eval token="DisplayPanel4">if(isnull(mvfind($panelTok$, "4")),null(),true())</eval>
      </change>
    </input>

 

annisha26
Explorer

@TheEggi98  thank you will try this.

0 Karma

bowesmana
SplunkTrust
SplunkTrust

Note that <change> is not officially supported for multiselect inputs, so it may not always work

Also, it's always a good idea to ask a new question and refer by link to an old thread if necessary - often old answered questions will not be seen and the original responders may not active any more to answer questions from that thread.

 

TheEggi98
Path Finder

Oh, I didnt knew that.


Where is that info?
In the Docs Define tokens for conditional operations with form inputs i cant find that info.

0 Karma

bowesmana
SplunkTrust
SplunkTrust

It's documented here

https://docs.splunk.com/Documentation/Splunk/latest/Viz/PanelreferenceforSimplifiedXML#input_.28form...

in the Shared input child elements section. 

It does seem to work generally, but I remember a couple of years ago finding a use case, where it did not work as expected, so I'm not totally sure if it really does or does not.

 

0 Karma

gjanders
SplunkTrust
SplunkTrust

I know this is quite an old post but the first to come up in google, I've confirmed that newer versions of Splunk allow:

<search depends="$token$">

Newer versions of the Simple XML Reference documentation also states this...(I checked as far back as 7.0.0 and it appears to be there)

mvohra_arcusdat
Explorer

Excellent example.

I am looking for option/setting which would make the panel execute the search only on certain condition.

Right now, the searches run with default values and they cause the dashboard to take a very long time and heavy load on the SH.

Suggestions and guidance much appreciated.

-MV

0 Karma

Ranazar
Path Finder

Minor typo fix for Option 1 - for the addition to the search queries so that the search only triggers when the token is set. Instead of this

    | eval dummy="$tokShowPanelA$"
     | fields - "$tokShowPanelA$"

It should be this (i.e. the field to hide is dummy). Otherwise the dummy field does show up when the search is run:

    | eval dummy="$tokShowPanelA$"
     | fields - "dummy"

niketn
Legend

@Ranazar thanks for the correction. Got to know even better way to do this would be

Option 1) Don't use eval just use the following. If the token does not exist search will not run. If the token exist fields - will not remove anything provided the existing search result does not have any field which may have same name as the value of token $tokShowPanel$

     | fields - "$tokShowPanelA$"

Option 2) Use built in comment macro in Splunk with the token dependency. The comment macro does not execute but adds the dependency with the token.

      `comment("RUN SEARCH ONLY WHEN $tokShowPanelA$ IS SET")`
____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

Ranazar
Path Finder

Oh, that's just brilliant! I know there's documentation and dashboard examples that probably cover this sort of thing, but it's near impossible to find time for that. Coming across these posts is super helpful.

0 Karma
Get Updates on the Splunk Community!

Introduction to Splunk Observability Cloud - Building a Resilient Hybrid Cloud

Introduction to Splunk Observability Cloud - Building a Resilient Hybrid Cloud  In today’s fast-paced digital ...

Observability protocols to know about

Observability protocols define the specifications or formats for collecting, encoding, transporting, and ...

Take Your Breath Away with Splunk Risk-Based Alerting (RBA)

WATCH NOW!The Splunk Guide to Risk-Based Alerting is here to empower your SOC like never before. Join Haylee ...