Dashboards & Visualizations
×

Join the Conversation

Without signing in, you're just watching from the sidelines. Sign in or Register to connect, share, and be part of the Splunk Community.
Ask a Question
Solved! Jump to solution

Dashboard - set/unset token issue

andreac81
Explorer
‎07-07-2017 07:07 AM

Hi to all,

I copied a splunk installation by a server to antoher (inclusive of apps, dasboards,...).
A dasboard should show some panels only when a token is passed (when a link in pressed), but when i press the link nothing happen.

In dashboard code there is

  <row depends="$showJboss$">
    <panel>

Following code used in th link that should open the panel

<a class="btn-pill1" href="#" data-unset-token="showVarnish,showJboss" data-token-json="{ &quot;showJboss&quot;: &quot;rename comment as show&quot;, &quot;showDropdown&quot;: &quot;rename comment as show&quot; }">JBOSS </a>

The XML code is the same of the dashbord that in other server correctly works, so I think the issue is not in XML code but elsewhere.

What can I check to identify the issue?

Thanks,
Andrea

Tags (1)
0 Karma
Reply
1 Solution
Solved! Jump to solution
Solution

sbbadri
Motivator
‎07-07-2017 07:26 AM

Check below links,

https://docs.splunk.com/Documentation/Splunk/6.6.2/Viz/tokens
https://splunkbase.splunk.com/app/1603/ - Splunk 6.x Dashboard Examples - Below example is from this app

<dashboard script="tokenlinks.js">
    <label>Token Links</label>
    <search id="base1">
        <query>index=_internal | timechart count by sourcetype</query>
        <earliest>-24h</earliest>
        <latest>now</latest>
    </search>
    <search id="base2">
        <query>index=_internal | timechart count by sourcetype</query>
        <earliest>-24h</earliest>
        <latest>now</latest>
    </search>
    <row>
        <panel>
            <title>Link Switcher Example</title>
            <html>
                <!-- Set the $show_chart$ token when the link is clicked, also unset the $show_table$ token -->
                <a href="#" class="btn-pill" data-set-token="show_chart" data-value="show" data-unset-token="show_table">
                    Show Chart
                </a>
                <!-- Set the $show_table$ token when the link is clicked, also unset the $show_chart$ token -->
                <a href="#" class="btn-pill" data-set-token="show_table" data-value="show" data-unset-token="show_chart">
                    Show Table
                </a>
                <!-- Unset both the $show_chart$ and $show_table$ token when the link is clicked -->
                <a href="#" class="btn-pill" data-token-json='{"show_table": null, "show_chart": null}'>Hide All</a>
            </html>
            <chart depends="$show_chart$">
                <search base="base1"/>
            </chart>
            <table depends="$show_table$">
                <search base="base1"/>
            </table>
            <html rejects="$show_chart$, $show_table$">
                <p>Click on one of the links above to select which visualization to show.</p>
            </html>
        </panel>
    </row>

    <row>
        <panel>
            <title>Button Switcher Example</title>
            <chart>
                <search base="base2"/>
            </chart>
            <html>
                <button class="btn" data-set-token="show_details" data-value="show">Show Details</button>
            </html>
        </panel>

        <!-- The panel is only shown once the user clicks on the button and the $show_details$ token is set -->
        <panel depends="$show_details$">
            <table>
                <title>Details</title>
                <search base="base2"/>
            </table>
            <html>
                <h2>Sample Description</h2>
                <p>This is some sample description that only shows up if you click on the "Show Details" button.</p>
                <button class="btn" data-unset-token="show_details">Hide Details</button>
            </html>
        </panel>
    </row>
</dashboard>

tokenlink.js

require(['jquery', 'underscore', 'splunkjs/mvc', 'util/console'], function($, _, mvc, console) {
    function setToken(name, value) {
        console.log('Setting Token %o=%o', name, value);
        var defaultTokenModel = mvc.Components.get('default');
        if (defaultTokenModel) {
            defaultTokenModel.set(name, value);
        }
        var submittedTokenModel = mvc.Components.get('submitted');
        if (submittedTokenModel) {
            submittedTokenModel.set(name, value);
        }
    }
    $('.dashboard-body').on('click', '[data-set-token],[data-unset-token],[data-token-json]', function(e) {
        e.preventDefault();
        var target = $(e.currentTarget);
        var setTokenName = target.data('set-token');
        if (setTokenName) {
            setToken(setTokenName, target.data('value'));
        }
        var unsetTokenName = target.data('unset-token');
        if (unsetTokenName) {
            setToken(unsetTokenName, undefined);
        }
        var tokenJson = target.data('token-json');
        if (tokenJson) {
            try {
                if (_.isObject(tokenJson)) {
                    _(tokenJson).each(function(value, key) {
                        if (value == null) {
                            // Unset the token
                            setToken(key, undefined);
                        } else {
                            setToken(key, value);
                        }
                    });
                }
            } catch (e) {
                console.warn('Cannot parse token JSON: ', e);
            }
        }
    });
});

View solution in original post

Reply
Solved! Jump to solution
Solution

sbbadri
Motivator
‎07-07-2017 07:26 AM

Check below links,

https://docs.splunk.com/Documentation/Splunk/6.6.2/Viz/tokens
https://splunkbase.splunk.com/app/1603/ - Splunk 6.x Dashboard Examples - Below example is from this app

<dashboard script="tokenlinks.js">
    <label>Token Links</label>
    <search id="base1">
        <query>index=_internal | timechart count by sourcetype</query>
        <earliest>-24h</earliest>
        <latest>now</latest>
    </search>
    <search id="base2">
        <query>index=_internal | timechart count by sourcetype</query>
        <earliest>-24h</earliest>
        <latest>now</latest>
    </search>
    <row>
        <panel>
            <title>Link Switcher Example</title>
            <html>
                <!-- Set the $show_chart$ token when the link is clicked, also unset the $show_table$ token -->
                <a href="#" class="btn-pill" data-set-token="show_chart" data-value="show" data-unset-token="show_table">
                    Show Chart
                </a>
                <!-- Set the $show_table$ token when the link is clicked, also unset the $show_chart$ token -->
                <a href="#" class="btn-pill" data-set-token="show_table" data-value="show" data-unset-token="show_chart">
                    Show Table
                </a>
                <!-- Unset both the $show_chart$ and $show_table$ token when the link is clicked -->
                <a href="#" class="btn-pill" data-token-json='{"show_table": null, "show_chart": null}'>Hide All</a>
            </html>
            <chart depends="$show_chart$">
                <search base="base1"/>
            </chart>
            <table depends="$show_table$">
                <search base="base1"/>
            </table>
            <html rejects="$show_chart$, $show_table$">
                <p>Click on one of the links above to select which visualization to show.</p>
            </html>
        </panel>
    </row>

    <row>
        <panel>
            <title>Button Switcher Example</title>
            <chart>
                <search base="base2"/>
            </chart>
            <html>
                <button class="btn" data-set-token="show_details" data-value="show">Show Details</button>
            </html>
        </panel>

        <!-- The panel is only shown once the user clicks on the button and the $show_details$ token is set -->
        <panel depends="$show_details$">
            <table>
                <title>Details</title>
                <search base="base2"/>
            </table>
            <html>
                <h2>Sample Description</h2>
                <p>This is some sample description that only shows up if you click on the "Show Details" button.</p>
                <button class="btn" data-unset-token="show_details">Hide Details</button>
            </html>
        </panel>
    </row>
</dashboard>

tokenlink.js

require(['jquery', 'underscore', 'splunkjs/mvc', 'util/console'], function($, _, mvc, console) {
    function setToken(name, value) {
        console.log('Setting Token %o=%o', name, value);
        var defaultTokenModel = mvc.Components.get('default');
        if (defaultTokenModel) {
            defaultTokenModel.set(name, value);
        }
        var submittedTokenModel = mvc.Components.get('submitted');
        if (submittedTokenModel) {
            submittedTokenModel.set(name, value);
        }
    }
    $('.dashboard-body').on('click', '[data-set-token],[data-unset-token],[data-token-json]', function(e) {
        e.preventDefault();
        var target = $(e.currentTarget);
        var setTokenName = target.data('set-token');
        if (setTokenName) {
            setToken(setTokenName, target.data('value'));
        }
        var unsetTokenName = target.data('unset-token');
        if (unsetTokenName) {
            setToken(unsetTokenName, undefined);
        }
        var tokenJson = target.data('token-json');
        if (tokenJson) {
            try {
                if (_.isObject(tokenJson)) {
                    _(tokenJson).each(function(value, key) {
                        if (value == null) {
                            // Unset the token
                            setToken(key, undefined);
                        } else {
                            setToken(key, value);
                        }
                    });
                }
            } catch (e) {
                console.warn('Cannot parse token JSON: ', e);
            }
        }
    });
});
Reply
Got questions? Get answers!

Join the Splunk Community Slack to learn, troubleshoot, and make connections with fellow Splunk practitioners in real time!

Meet up IRL or virtually!

Join Splunk User Groups to connect and learn in-person by region or remotely by topic or industry.

Get Updates on the Splunk Community!

A Four-Part Event Series: Full Stack Observability For the AI Era

As AI reshapes applications, infrastructure, and the way teams operate, the traditional boundaries of ...

SOC4Kafka - New Kafka Connector Powered by OpenTelemetry

The new SOC4Kafka connector, built on OpenTelemetry, enables the collection of Kafka messages and forwards ...

Event Series: Level up your SOC: Advancing with Splunk Enterprise Security

AI has fundamentally raised the stakes for security operations, and this three-part series is your guide to ...