Dashboards & Visualizations

Getting Time token value in JS to use in Drill-Down with Status Indicator Viz...

kwestlake
Engager

Hi All

I was wondering if any kind soul could point me in the right direction with this.

I recently put together a jazzy looking dashboard using the Status Indicator Visualization, unfortunately though, it has no built-in drill down capabilities. So the hack others on this forum use is open a pop-up when the panel is clicked using JS. I've got this bit working, for the life of me, I can't figure out how to get the filter values/tokens from the current dashboard to pass onto the pop-up URL.

I've hacked together the following script using examples on the forum and the Splunk dev docs:

 // Components to require
 var components = [
    "splunkjs/ready!",
    "splunkjs/mvc/simplexml/ready!",
    "jquery"
];

// Require the components
require(components, function(
    mvc,
    ignored,
    $
) {
    $('#something').click(function() {

        // Get the default model
        var defaultTokenModel = splunkjs.mvc.Components.getInstance("default");
        // Get some token from there
        var time_token = defaultTokenModel.get("time_field");

        // Other method from doc
        //var tokens = mvc.Components.get("default");
        //var time_token = tokens.get("time_field");

        window.open(
                  'drilldown_report?earliest=' + time_token.earliest,
                  '_blank' // <- This is what makes it open in a new window.
                );
    });
});

I tried 2 methods of getting the Time token, using "Components.getInstance()" and "Components.get()", in addition tried looking for the token name of "time_field" and "form.time_field", the actual parent-dashboard URL is:

https://splunk.myhome.uk:8000/en-GB/app/search/my-core/edit?form.time_field.earliest=-24h%40h&form.t...

but all I ever get back is

VM3277:30 Uncaught TypeError: Cannot read property '**earliest**' of undefined
    at HTMLDivElement.eval (eval at globalEval (common.js:1003), <anonymous>:30:61)
    at HTMLDivElement.dispatch (common.js:1014)
    at HTMLDivElement.elemData.handle (common.js:1014)
eval @ VM3277:30
dispatch @ common.js:1014
elemData.handle @ common.js:1014
0 Karma
1 Solution

manjunathmeti
SplunkTrust
SplunkTrust

You need to require "splunkjs/mvc" library to access tokens.

// Components to require
  var components = [
     "splunkjs/mvc" ,
     "splunkjs/ready!",
     "splunkjs/mvc/simplexml/ready!",
     "jquery"
 ];

View solution in original post

0 Karma

manjunathmeti
SplunkTrust
SplunkTrust

You need to require "splunkjs/mvc" library to access tokens.

// Components to require
  var components = [
     "splunkjs/mvc" ,
     "splunkjs/ready!",
     "splunkjs/mvc/simplexml/ready!",
     "jquery"
 ];
0 Karma

kwestlake
Engager

Thank you.. Also, I discovered I was addressing the tokens wrong. I dumped the objects out to the browser console, and found the correct paths. Using the following its now working:

        var defaultTokenModel = splunkjs.mvc.Components.getInstance("submitted");

        // Get some token from there
        var time_token = defaultTokenModel.get("form.time_field.earliest");

Also I believe time_field.earliest would also do - Basically I was mis-understanding the value returned by Get(), I thought it was an object, in fact, the tokens seem to be stored in a named list.

0 Karma
Get Updates on the Splunk Community!

Adoption of RUM and APM at Splunk

    Unleash the power of Splunk Observability   Watch Now In this can't miss Tech Talk! The Splunk Growth ...

Routing logs with Splunk OTel Collector for Kubernetes

The Splunk Distribution of the OpenTelemetry (OTel) Collector is a product that provides a way to ingest ...

Welcome to the Splunk Community!

(view in My Videos) We're so glad you're here! The Splunk Community is place to connect, learn, give back, and ...