Dashboards & Visualizations

How to display dropdown values in the title bar of a panel?

dbcase
Motivator

Hi,

I have 2 dropdowns at the top of a dashboard, the first one is a time period selection and the second one is a product selection. See the 2nd screenshote below. What I'd like to do is use the values of each in a subsequent panel. In this case the values would be "Last 7 days" and "All". I've been poking around with it but no luck yet. See the 1st screenshot below. Here is the XML that I've been toying with alt text. Here is the XML that I've been toying with <title>Playback vs Error for $Product_token$ for $time_field.label$</title>

alt text

0 Karma
1 Solution

niketn
Legend

@dbcase if you want to show a preset value or relative value from Time Picker as Panel Title you can refer to one of my previous answers: https://answers.splunk.com/answers/633356/whats-the-token-name-for-the-time-pickers-display.html

If you want to show Earliest and Latest Time based on Time Picker Selected, this is another one of my answers: https://answers.splunk.com/answers/578984/running-one-of-two-searches-based-on-time-picker-s.html

For the Product dropdown the token contains the Value of the dropdown while you need to display the Label. So, you need to access the default dropdown input token $label$ in the <change> event handler and pass it on to the panel. Refer to following run anywhere dashboard example. You should also check out Splunk Dashboard Examples App.

<form>
  <label>Drodown Label</label>
  <fieldset submitButton="false">
    <input type="dropdown" token="tokProduct">
      <label>Select a Product</label>
      <change>
        <set token="tokProductLabel">$label$</set>
      </change>
      <choice value="a">Alpha</choice>
      <choice value="b">Beta</choice>
      <choice value="c">Charlie</choice>
      <choice value="d">Delta</choice>
      <default>a</default>
    </input>
  </fieldset>
  <row>
    <panel>
      <title>tokProductLabel: $tokProductLabel$</title>
    </panel>
  </row>
</form>
____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

0 Karma

niketn
Legend

@dbcase if you want to show a preset value or relative value from Time Picker as Panel Title you can refer to one of my previous answers: https://answers.splunk.com/answers/633356/whats-the-token-name-for-the-time-pickers-display.html

If you want to show Earliest and Latest Time based on Time Picker Selected, this is another one of my answers: https://answers.splunk.com/answers/578984/running-one-of-two-searches-based-on-time-picker-s.html

For the Product dropdown the token contains the Value of the dropdown while you need to display the Label. So, you need to access the default dropdown input token $label$ in the <change> event handler and pass it on to the panel. Refer to following run anywhere dashboard example. You should also check out Splunk Dashboard Examples App.

<form>
  <label>Drodown Label</label>
  <fieldset submitButton="false">
    <input type="dropdown" token="tokProduct">
      <label>Select a Product</label>
      <change>
        <set token="tokProductLabel">$label$</set>
      </change>
      <choice value="a">Alpha</choice>
      <choice value="b">Beta</choice>
      <choice value="c">Charlie</choice>
      <choice value="d">Delta</choice>
      <default>a</default>
    </input>
  </fieldset>
  <row>
    <panel>
      <title>tokProductLabel: $tokProductLabel$</title>
    </panel>
  </row>
</form>
____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma

dbcase
Motivator

Hi Niektnilay,

Many thanks! The label for the product worked great! I'm still not able to obtain the label for the time though.

I tried this but no luck

<search>
     <query>| makeresults
     </query>
     <done>
       <eval token="tokManuallySelectedTime">"From ".strftime(strptime($time_field.earliestTime$,"%Y/%m/%d %H:%M:%S"),"%Y/%m/%d %H:%M:%S")." to ".strftime(strptime($time_field.latestTime$,"%Y/%m/%d %H:%M:%S"),"%Y/%m/%d %H:%M:%S")</eval>
       <eval 
   </search>

<row>
    <panel>
      <title>Playback vs Error for $Product_token_label$ for $tokManuallySelectedTime$</title>
      <chart>
        <title>Click a column for additional detail</title>
        <search>
etc.......
0 Karma

dbcase
Motivator

found it

<input type="time" token="time_field">
      <label>Please select a time period</label>
      <change>
         <set token="tokDisplaySelectedTime">$label$</set>
       </change>
      <default>
        <earliest>-24h@h</earliest>
        <latest>now</latest>
      </default>
    </input>

niketn
Legend

In your dummy search you have missed the tokens from your time picker. So the result will always be All time i.e. 1970 Date till 0. If your Time Input is time_field then you need to add the following <earliest> and <latest> time to your dummy search:

 <search>
      <query>| makeresults
      </query>
      <done>
        <eval token="tokManuallySelectedTime">"From ".strftime(strptime($time_field.earliestTime$,"%Y/%m/%d %H:%M:%S"),"%Y/%m/%d %H:%M:%S")." to ".strftime(strptime($time_field.latestTime$,"%Y/%m/%d %H:%M:%S"),"%Y/%m/%d %H:%M:%S")</eval>
        <eval 
        <earliest>$time_field.earliest$<earliest>
        <latest>$time_field.latest$<latest>
    </search>

Please try out and confirm!

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma
Get Updates on the Splunk Community!

.conf24 | Day 0

Hello Splunk Community! My name is Chris, and I'm based in Canberra, Australia's capital, and I travelled for ...

Enhance Security Visibility with Splunk Enterprise Security 7.1 through Threat ...

 (view in My Videos)Struggling with alert fatigue, lack of context, and prioritization around security ...

Troubleshooting the OpenTelemetry Collector

  In this tech talk, you’ll learn how to troubleshoot the OpenTelemetry collector - from checking the ...