Dashboards & Visualizations

How to create 2 tokens from 1 drop-down selection?

tdiestel
Path Finder

Hi All;

I'm trying to create a custom time picker which will allow users to select a specific day (not every day is here, which is why this has to be custom) from a drop down and then from that selected value produce 2 tokens: one to represent the earliest time and one for the latest time. Problem is that the drop down will only let me choose 1 field to populate the value. Splunk does give the option to do "change" in the source code to set another token but from there you are only able to set the token to the value or the label of the drop down.

In my situation the label represents a specific date and the value represents the epoch earliest/beginning timestamp for the date. what I want to do is something like this:

       <set token="latest_test">$value$+86400</set>
       <set token="earliest_test">$value$</set>

The only problem is that the latest_value just takes the "+86400" as a character and does not form any mathematical addition.

Any suggestions on how to get over this problem would be extremely appreciated. If they involve using some kind of JS file, that's great but could you provide an example of one as I'm not too experienced with JS.

Also,This input is a dynamic input which comes from a table that has the fields title (used as the label in the drop down), earliest (used as the value in the drop down), and latest (NOT used anywhere). If there was a way to assign this latest value to a token, that would also be extremely helpful as well.

Thanks,
Tyler

Tags (3)
1 Solution

Raghav2384
Motivator

Can you add two more fields in the source?
eval etime = _time | eval ltime = _time+86400

And call form.target.earliest=$row.etime$&form.target.latest=$row.ltime$

I had similar requirement
Thanks,
Raghav

View solution in original post

Raghav2384
Motivator

Can you add two more fields in the source?
eval etime = _time | eval ltime = _time+86400

And call form.target.earliest=$row.etime$&form.target.latest=$row.ltime$

I had similar requirement
Thanks,
Raghav

tdiestel
Path Finder

Works great! thank you for helping me out with this.

here's my code for a reference:

App Usage
This Dashboard gives a full overview of many different App components.

<input type="dropdown" token="date" searchWhenChanged="true">
  <label>Select a Date</label>
  <search>
    <query>index=index_1 source="dbmon-tail://db_1/new_timepicker"| dedup id| fields id title earliest latest|sort - id</query>
    <earliest>0</earliest>
    <latest></latest>
  </search>
  <fieldForLabel>title</fieldForLabel>
  <fieldForValue>earliest</fieldForValue>
  <default>@d</default>
  <change>
    <set token="latest_test">$row.latest$</set>
    <set token="earliest_test">$row.earliest$</set>
  </change>
</input>

.....

    <panel>
      <chart>
        <title>Overall App Usage Trend Chart</title>
        <searchString>index=index_2|stats count
        <earliestTime>$earliest_test$</earliestTime>
        <latestTime>$latest_test$</latestTime>
 ellipsisNone
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">collapsed</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">true</option>
        <option name="charting.axisY2.scale">linear</option>
        <option name="charting.chart">column</option>
        <option name="charting.chart.nullValueMode">zero</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">bottom</option>
        <option name="charting.axisTitleY2.text">Actions per User</option>
        <option name="charting.chart.overlayFields">"Actions per User"</option>
      </chart>
    </panel>
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...