topic Re: How to let dropdown and time inputs share the same tokens? in Dashboards & Visualizations

How to let dropdown and time inputs share the same tokens?

dzyfer — Mon, 19 Sep 2022 03:01:38 GMT

Hi, I would like to set time ranges from 2 different types of inputs, Dropdown and Time, as shared tokens into a panel.

Currently, this is the code I have, the Dropdown has 4 options, and the Time input appears depending on the last dropdown option. I am stuck on passing the time range from the Time input into the "custom_earliest" and "custom_latest" tokens.

<fieldset submitButton="false"> <input type="dropdown" token="field1"> <label>Time Selection</label> <choice value="yesterday">Yesterday</choice> <choice value="-7d">Last 7 Days</choice> <choice value="mtd">Month To Date</choice> <choice value="custom">Custom Time</choice> <change> <condition label="Yesterday"> <set token="custom_earliest">-7d@d+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Last 7 Days"> <set token="custom_earliest">-4w@d+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Month To Date"> <set token="custom_earliest">-5mon@mon+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Custom Time"> <set token="showCustom">Y</set> </condition> </change> <default>yesterday</default> <initialValue>yesterday</initialValue> </input> <input type="time" token="customTime" depends="$showCustom$"> <label>Time Range</label> <default> <earliest>-3d@d+7h</earliest> <latest>-2d@d+7h</latest> </default> </input> </fieldset>

Any help would be appreciated, thanks!

Re: How to let dropdown and time inputs share the same tokens?

bowesmana — Mon, 19 Sep 2022 03:37:18 GMT

Use a hidden search (this example shows it in a panel) and set the custom_* tokens in the <done> clause of the search, which is triggered when you select Custom

<form> <label>TEST</label> <fieldset submitButton="false"> <input type="dropdown" token="field1"> <label>Time Selection</label> <choice value="yesterday">Yesterday</choice> <choice value="-7d">Last 7 Days</choice> <choice value="mtd">Month To Date</choice> <choice value="custom">Custom Time</choice> <change> <condition label="Yesterday"> <set token="custom_earliest">-7d@d+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Last 7 Days"> <set token="custom_earliest">-4w@d+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Month To Date"> <set token="custom_earliest">-5mon@mon+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Custom Time"> <set token="showCustom">Y</set> </condition> </change> <default>yesterday</default> <initialValue>yesterday</initialValue> </input> <input type="time" token="customTime" depends="$showCustom$"> <label>Time Range</label> <default> <earliest>-3d@d+7h</earliest> <latest>-2d@d+7h</latest> </default> </input> </fieldset> <row> <panel> <html> Custom:$customTime$<br/> earliest:$custom_earliest$<br/> latest :$custom_latest$<br/> </html> </panel> <panel> <table> <search> <query> | makeresults | addinfo </query> <done> <set token="custom_earliest">$result.info_min_time$</set> <set token="custom_latest">$result.info_max_time$</set> </done> <earliest>$customTime.earliest$</earliest> <latest>$customTime.latest$</latest> </search> </table> </panel> </row> </form>

Re: How to let dropdown and time inputs share the same tokens?

dzyfer — Mon, 19 Sep 2022 09:27:32 GMT

Hi @bowesmana , thanks for the reply, however I realised that doing this causes the dashboard to default to the custom time range upon reset:

<input type="time" token="customTime" depends="$showCustom$"> <label>Time Range</label> <default> <earliest>-3d@d+7h</earliest> <latest>-2d@d+7h</latest> </default> </input>

instead of the first option from the dropdown (Yesterday):

<condition label="Yesterday"> <set token="custom_earliest">-7d@d+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> </change> <default>yesterday</default> <initialValue>yesterday</initialValue>

Any idea why? Thanks

Re: How to let dropdown and time inputs share the same tokens?

bowesmana — Mon, 19 Sep 2022 23:30:33 GMT

Yes, it's just a token housekeeping issue - the search that calculates earliest/latest always runs, so even if you select another time window, that search always runs, so will calculate the custom time range.

You just need to make the search use depends="$showCustom$" as in the attached, which you will see then prevents the search from running, so it does not overwrite the custom_* tokens if you select any of the non-custom options.

Note that in your definition, "Yesterday" is not actually yesterday - it's actually last 7 days (-7d@d+7h) and last 7 days is last month...

<form> <label>TEST</label> <fieldset submitButton="false"> <input type="dropdown" token="field1"> <label>Time Selection</label> <choice value="yesterday">Yesterday</choice> <choice value="-7d">Last 7 Days</choice> <choice value="mtd">Month To Date</choice> <choice value="custom">Custom Time</choice> <change> <condition label="Yesterday"> <set token="custom_earliest">-7d@d+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Last 7 Days"> <set token="custom_earliest">-4w@d+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Month To Date"> <set token="custom_earliest">-5mon@mon+7h</set> <set token="custom_latest">@d+7h</set> <unset token="showCustom"></unset> </condition> <condition label="Custom Time"> <set token="showCustom">Y</set> </condition> </change> <default>yesterday</default> <initialValue>yesterday</initialValue> </input> <input type="time" token="customTime" depends="$showCustom$"> <label>Time Range</label> <default> <earliest>-3d@d+7h</earliest> <latest>-2d@d+7h</latest> </default> </input> </fieldset> <row> <panel> <html> Custom:$customTime$<br/> custom_earliest:$custom_earliest$<br/> custom_latest :$custom_latest$<br/> </html> </panel> <panel> <table> <search depends="$showCustom$"> <done> <set token="custom_earliest">$result.info_min_time$</set> <set token="custom_latest">$result.info_max_time$</set> </done> <query>| makeresults | addinfo | eval min=strftime(info_min_time, "%F %T") | eval max=strftime(info_max_time, "%F %T") | fields - info_sid</query> <earliest>$customTime.earliest$</earliest> <latest>$customTime.latest$</latest> </search> <option name="refresh.display">progressbar</option> </table> </panel> </row> </form>