Dashboards & Visualizations
Highlighted

Setting $job.earliestTime$ and $job.latestTime$ tokens for the date range of a dashboard?

Contributor

We have a heavily used metrics dashboard that is showing a lot of data to execs. The data is filtered by a (mostly) universal time picker at the top of the dash. The time picker is showing a truncated date. In edit/token options/default, you can see From Aug 1, 2016 to Aug 31, 2017. However, the actual time picker is showing "From Aug 1, 2016 to Aug...".

This wouldn't be a huge deal, if the dates displayed correctly when you click the drop down arrow on the time picker. However, the dates that are displayed (in the date range picker) are from yesterday to today, in this case "Sep 20-Sep 21". So, the user doesn't know the exact time period that's being searched on by default.

I'm expecting the dates being displayed after you click the dropdown is a feature, but how do I show the entire date range in the time picker's default view?

0 Karma
Highlighted

Re: Setting $job.earliestTime$ and $job.latestTime$ tokens for the date range of a dashboard?

Legend

@manderson7, you can feed earliest and latest time tokens from Time Picker to a dummy search, which can then spit out predefined search job tokens i.e. $job.earliestTime$ and $job.latestTime$, which can be used to set the tokens using eval tags to display the selected Earliest Time and Latest Time in the HTML Panel.

Following is a run anywhere search with an example. Please try out and confirm.

<form>
  <label>Dashboard Time Picker Display Earliest and Latest</label>
  <search>
    <query>| makeresults
    </query>
    <earliest>$tokTime.earliest$</earliest>
    <latest>$tokTime.latest$</latest>
    <done>
      <eval token="earliestTime">strftime(strptime($job.earliestTime$,"%Y/%m/%d %H:%M:%S %p"),"%Y/%m/%d %H:%M:%S %p")</eval>
      <eval token="latestTime">strftime(strptime($job.latestTime$,"%Y/%m/%d %H:%M:%S %p"),"%Y/%m/%d %H:%M:%S %p")</eval>
    </done>
  </search>
  <fieldset submitButton="false"></fieldset>
  <row>
    <panel>
      <input type="time" token="tokTime">
        <label></label>
        <default>
          <earliest>1505845800</earliest>
          <latest>1506018600</latest>
        </default>
      </input>
      <html>
        Date &amp; Time Range Between: $earliestTime$ and $latestTime$ 
      </html>
    </panel>
  </row>
</form>



| eval message="Happy Splunking!!!"


View solution in original post

0 Karma
Highlighted

Re: Setting $job.earliestTime$ and $job.latestTime$ tokens for the date range of a dashboard?

Contributor

I see this working on the test dashboard, so thanks for that. I'm having problems making it work on my prod dashboard however.

<form script="tabs.js" stylesheet="tabs.css, custom.css">
  <label>Security Posture-Executive View Clone</label>
  <fieldset submitButton="true">
    <input type="time" token="latest_time_picker" searchWhenChanged="true">
      <label>As of Time</label>
      <default>
        <earliest>$tokTime.earliest$</earliest>
        <latest>$tokTime.latest$</latest>
               <eval token="earliestTime">strftime(strptime($job.earliestTime$,"%Y/%m/%d %H:%M:%S %p"),"%Y/%m/%d %H:%M:%S %p")</eval>
       <eval token="latestTime">strftime(strptime($job.latestTime$,"%Y/%m/%d %H:%M:%S %p"),"%Y/%m/%d %H:%M:%S %p")</eval>
      </default>
      </input>
      <html>
         Date &amp; Time Range Between: $earliestTime$ and $latestTime$ 
      </html>
  </fieldset>

That shows " Date & Time Range Between: $earliestTime$ and $latestTime$ ", not the date and time assigned, so the token isn't getting assigned.

0 Karma
Highlighted

Re: Setting $job.earliestTime$ and $job.latestTime$ tokens for the date range of a dashboard?

Legend

@manderson7, you need to place the following code from the test dashboard between <label> and <fieldset> nodes similar to how it has been used in the test dashboard.

 <form script="tabs.js" stylesheet="tabs.css, custom.css">
   <label>Security Posture-Executive View Clone</label>
   <search>
         <query>| makeresults
         </query>
         <earliest>$latest_time_picker.earliest$</earliest>
         <latest>$latest_time_picker.latest$</latest>
         <done>
           <eval token="earliestTime">strftime(strptime($job.earliestTime$,"%Y/%m/%d %H:%M:%S %p"),"%Y/%m/%d %H:%M:%S %p")</eval>
           <eval token="latestTime">strftime(strptime($job.latestTime$,"%Y/%m/%d %H:%M:%S %p"),"%Y/%m/%d %H:%M:%S %p")</eval>
         </done>
   </search>
   <fieldset submitButton="true">
   </fieldset>
   <row>
     <panel>
       <input type="time" token="latest_time_picker" searchWhenChanged="true">
           <label>As of Time</label>
           <default>
               <earliest>1505845800</earliest>
               <latest>1506018600</latest>
            </default>
       </input>
       <html>
          Date &amp; Time Range Between: $earliestTime$ and $latestTime$ 
       </html>
     </panel>
   </row>

Once you have tested with this you can put the default value for time picker latest_time_picker as per your need.




| eval message="Happy Splunking!!!"


Highlighted

Re: Setting $job.earliestTime$ and $job.latestTime$ tokens for the date range of a dashboard?

Contributor

That did it, thank you.

0 Karma
Highlighted

Re: Setting $job.earliestTime$ and $job.latestTime$ tokens for the date range of a dashboard?

Legend

@manderson7, Great! I have converted to answer. Kindly accept to mark question as answered!




| eval message="Happy Splunking!!!"


0 Karma