topic Re: How to enable/disable drilldown via javascript in an HTML dashboard? in Dashboards & Visualizations

How to enable/disable drilldown via javascript in an HTML dashboard?

sfatnass — Tue, 29 Sep 2015 12:50:03 GMT

Hi,

I want to know how to enable and disable drilldown with jquery using onclick event.

ps: i'm using an html dashboard

thx

Re: How to enable/disable drilldown via javascript in an HTML dashboard?

tom_frotscher — Tue, 29 Sep 2015 13:29:39 GMT

Hi,

get the component by id and use preventDefault to prevent the default onclick behavior.

   var myview = mvc.Components.getInstance("your_view_id");
   myview.on("click", function (e) {
       e.preventDefault();
       // To do: respond to events
   });
 });

Re: How to enable/disable drilldown via javascript in an HTML dashboard?

sfatnass — Tue, 29 Sep 2015 14:38:19 GMT

The question is about drilldown

I know how use jquery in Splunk, but how can change drilldown settings?

I tried this, but it doesn't work:

document.getElementById('id_table').settings.set('drilldown','none');

and 

document.getElementById('id_table').setattr('drilldown','none');

Another person searched about this function:
http://answers.splunk.com/answers/216486/how-to-enable-disable-table-element-drilldown-thro.html

thx

Re: How to enable/disable drilldown via javascript in an HTML dashboard?

sfatnass — Wed, 30 Sep 2015 11:41:24 GMT

nobody can help?

Re: How to enable/disable drilldown via javascript in an HTML dashboard?

tom_frotscher — Wed, 30 Sep 2015 11:48:01 GMT

Then you have to use:

var myview = mvc.Components.getInstance("your_view_id");
myview.settings.set('drilldown', 'none');

What you did is to select a dom element. Ofcourse the dom element does not have a set function for drilldowns. Only the model of the view has the settings and methods that are mentioned in the reference here: http://docs.splunk.com/Documentation/WebFramework

Greetings

Tom

Re: How to enable/disable drilldown via javascript in an HTML dashboard?

piUek — Wed, 30 Sep 2015 12:41:28 GMT

I think the proper way would be:
- get the mvc element

- change drilldown settings
- re-render the table

It is little tricky at first:

var element1 = mvc.Components.get('element1');

element1.getVisualization(function(tableView) {
    tableView.settings.set('drilldown', 'none');
    tableView.table.render();
});

If You are doing this in the same script context, then You can simply use it's handler.
In this example, I've created 2 buttons - on and off:

        <button id='drillOff'>Off</button>
        <button id='drillOn'>On</button>

And then created the table and attached functions which change drilldown behaviour:

            var element1 = new TableElement({
                "id": "element1",
                "drilldown": "row",
                'drilldownRedirect': false,
                "rowNumbers": "undefined",
                "wrap": "undefined",
                "managerid": "search1",
                "el": $('#element1')
            }, {
                tokens: true,
                tokenNamespace: "submitted"
            }).render();

            $('#drillOff').click(function() {
                element1.getVisualization(function(vis) {
                    vis.settings.set('drilldown', 'none');
                    vis.table.render();
                })
            })

            $('#drillOn').click(function() {
                element1.getVisualization(function(vis) {
                    vis.settings.set('drilldown', 'row');
                    vis.table.render();
                })
            })

Re: How to enable/disable drilldown via javascript in an HTML dashboard?

sfatnass — Wed, 30 Sep 2015 14:52:17 GMT

thx it work ^^