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"
 ];

View solution in original post

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
Did you miss .conf21 Virtual?

Good news! The event's keynotes and many of its breakout sessions are now available online, and still totally FREE!