Splunk Enterprise

Using SplunkJs, by clicking button, token value is getting set but not passing to drilldown panel searches

glingaraj
Explorer

Using SplunkJs, by clicking button, token value is getting set but not passing to drilldown panel searches.

Can you please help on why its not working?

Steps:

1. Create Splunk js to enable token on click of a button

2. In dashboard, add a HTML button with required details (please refer the code attached)

3. Create a panel and update search with the token_name

Observation:

Token value is getting set but not sure if the value is passed to down panels or panel is not identifying the token value that has been set by clicking on button

 

Source code:

<dashboard script="start_tracking_1.js" version="1.1">
<label>test_dashboard 3</label>
<row id="tab_menu">
<panel>
<title>$clickedButtonValue$</title>
<html>
<button type="button" class="btn button_tab" id="StartTracking" data-value="value1">
<h2 style="text-align: center;">
<span style="color: #000000;">
<strong>Start Tracking</strong>
</span>
</h2>
</button>
</html>
</panel>
</row>
<row>
<panel>
<table>
<title>Drilldown Panel</title>
<search>
<query>index=_internal source="$clickedButtonValue$" | head 10</query>
<earliest>-24h@h</earliest>
<latest>now</latest>
</search>
<option name="refresh.display">progressbar</option>
</table>
</panel>
</row>
</dashboard>

 

Splunk JS:

require([
'splunkjs/mvc',
'splunkjs/mvc/simplexml/ready!',
'jquery'
], function(mvc, ready, $) {
var defaultTokenModel = mvc.Components.getInstance('default');

// Add click event listener to button with id 'StartTracking'
$('#StartTracking').on('click', function() {
var value = $(this).data('value'); // Correct jQuery method to get data-value
console.log('Button clicked, data-value: ' + value);
defaultTokenModel.set('clickedButtonValue', value); // Set token value
});
});
Labels (1)
0 Karma
1 Solution

bowesmana
SplunkTrust
SplunkTrust

I would generally recommend setting the token to the submitted token model as well as the default, i.e.

var submittedTokenModel = mvc.Components.getInstance('submitted');

and

submittedTokenModel.set('clickedButtonValue', value);

I'm also not entirely sure how the <dashboard> or <form> structure of a dashboard changes how tokens are managed, because the token models effect how the tokens are used when clicking submit buttons in a dashboard, where the dashboard will always be a <form> dashboard.

So, first change the dashboard to <form> and then try the changed JS - hopefully one will make the difference.

 

View solution in original post

bowesmana
SplunkTrust
SplunkTrust

I would generally recommend setting the token to the submitted token model as well as the default, i.e.

var submittedTokenModel = mvc.Components.getInstance('submitted');

and

submittedTokenModel.set('clickedButtonValue', value);

I'm also not entirely sure how the <dashboard> or <form> structure of a dashboard changes how tokens are managed, because the token models effect how the tokens are used when clicking submit buttons in a dashboard, where the dashboard will always be a <form> dashboard.

So, first change the dashboard to <form> and then try the changed JS - hopefully one will make the difference.

 

glingaraj
Explorer

Hi @bowesmana 

It's working now post changing "dashboard" to "form" and using "submittedTokenModel" in Splunkjs.

Thank you for your response !

0 Karma
Career Survey
First 500 qualified respondents will receive a $20 gift card! Tell us about your professional Splunk journey.

Can’t make it to .conf25? Join us online!

Get Updates on the Splunk Community!

Can’t Make It to Boston? Stream .conf25 and Learn with Haya Husain

Boston may be buzzing this September with Splunk University and .conf25, but you don’t have to pack a bag to ...

Splunk Lantern’s Guide to The Most Popular .conf25 Sessions

Splunk Lantern is a Splunk customer success center that provides advice from Splunk experts on valuable data ...

Unlock What’s Next: The Splunk Cloud Platform at .conf25

In just a few days, Boston will be buzzing as the Splunk team and thousands of community members come together ...