Can`t seem to get my head round this one - I`ve got a table and would like the users to be able to click on a row and to add a Summary comment, but there`s a bug in the code. The comments get submitted BEFORE I click on the Submit button, which doesn`t seems to work anyway.
<form version="1.1" theme="light" script="TA-images_and-_files:tokenlinks.js">
<label>Report</label>
<search>
<query>| makeresults|eval Date=strftime(_time,"%d/%m/%Y")|fields - _time</query>
<done>
<set token="defaut_time">$result.Date$</set>
</done>
</search>
<fieldset submitButton="false">
<input type="dropdown" token="date_tok" searchWhenChanged="true">
<label>Date:</label>
<fieldForLabel>Date</fieldForLabel>
<fieldForValue>Date</fieldForValue>
<search>
<query>| makeresults
| timechart span=1d count
| sort - _time
| eval Date=strftime(_time, "%d/%m/%Y"), earliest=relative_time(_time, "@d")
| table Date, earliest
| head 7
| sort - earliest</query>
<earliest>-7d@h</earliest>
<latest>now</latest>
</search>
<default>$defaut_time$</default>
</input>
<input type="dropdown" token="shift_tok" searchWhenChanged="true">
<label>Shift:</label>
<choice value="Day">Day</choice>
<choice value="Night">Night</choice>
<default>Day</default>
<initialValue>Day</initialValue>
</input>
</fieldset>
<row>
<panel id="input_panel" depends="$show_input$">
<input type="text" token="Summary">
<label>Summary</label>
</input>
<input type="text" token="Date">
<label>Date</label>
</input>
<input type="text" token="Time">
<label>Time</label>
</input>
<input type="text" token="Shift">
<label>Shift</label>
</input>
<html>
<div>
<button type="button" id="buttonId" class="btn btn-primary">Submit</button>
<button style="margin-left:10px;" class="btn" data-token-json="{"show_input": null}">Cancel</button>
</div>
</html>
</panel>
</row>
<row depends="$hideMe$">
<panel>
<table>
<search>
<done>
<unset token="form.Summary"></unset>
<unset token="form.Date"></unset>
<unset token="form.Time"></unset>
<unset token="form.Shift"></unset>
<unset token="show_input"></unset>
</done>
<query>| inputlookup handover_timeline_comments.csv
| append [
| makeresults | eval "Summary" = "$form.Summary$", Shift="$form.Shift$", Date="$form.Date$", Time="$form.Time$"
]
| outputlookup handover_timeline_comments.csv</query>
<earliest>$earliest$</earliest>
<latest>$latest$</latest>
<refresh>30</refresh>
<refreshType>delay</refreshType>
</search>
<option name="drilldown">none</option>
<option name="refresh.display">progressbar</option>
</table>
</panel>
</row>
<row>
<panel>
<table>
<search>
<query>| makeresults count=24
| eval Date= "$date_tok$", Shift="$shift_tok$"
| streamstats count as Time
| eval Time=if(Time<10, "0".Time.":00", Time.":00")
| eval Time=case(
Shift == "Night" AND Time >= "19:00", Time,
Shift == "Day" AND Time >= "07:00" AND Time <= "18:00", Time,
1==1, null )
| where isnotnull(Time)
| append [
| makeresults count=24
| streamstats count as Time
| eval Time=if(Time<10, "0".Time.":00", Time.":00")
| table Time
| eval Date= "$date_tok$", Shift="$shift_tok$"
| eval Time=case(
Shift == "Night" AND Time <= "06:00", Time,
1==1, null )
| where isnotnull(Time)
]
| eval Summary=""
| fields - _time
| lookup handover_timeline_comments.csv Date Shift Time OUTPUT Summary
| eventstats last(Summary) as Summary by Date Shift Time</query>
<earliest>-24h@h</earliest>
<latest>now</latest>
<refresh>10s</refresh>
</search>
<option name="count">12</option>
<option name="drilldown">cell</option>
<option name="refresh.display">progressbar</option>
<drilldown>
<set token="form.Date">$row.Date$</set>
<set token="form.Shift">$row.Shift$</set>
<set token="form.Time">$row.Time$</set>
<set token="show_input">true</set>
</drilldown>
</table>
</panel>
</row>
</form>
.js:
requirejs([
'../app/simple_xml_examples/libs/jquery-3.6.0-umd-min',
'../app/simple_xml_examples/libs/underscore-1.6.0-umd-min',
'util/console',
'splunkjs/mvc',
'splunkjs/mvc/simplexml/ready!'
], function($, _, console, mvc) {
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);
}
}
});
});
@tomapatan- I'm not 100% sure on what are you trying to do but what I can say is, you probably might not need JS file. Simple XML dashboard can do it without need of JS code.
This is just another example to explain you the usage. This example shows token on the Dropdown filter, but token on Table or Chart drilldown (on-click) would work the similar way. I'll put the reference doc below -
<form>
<label>dropdown</label>
<fieldset submitButton="false">
<input type="dropdown" token="tkn_number">
<label>field1</label>
<default>3</default>
<fieldForLabel>count</fieldForLabel>
<fieldForValue>count</fieldForValue>
<search>
<query>| makeresults count=10 | streamstats count</query>
<earliest>-24h@h</earliest>
<latest>now</latest>
</search>
<change>
<condition match="'value'=="3"">
<set token="tkn_show">true</set>
</condition>
<condition>
<unset token="tkn_show"></unset>
</condition>
</change>
</input>
</fieldset>
<row depends="$tkn_show$">
<panel>
<table>
<search>
<query>index="_internal" |stats count by sourcetype</query>
<earliest>-24h@h</earliest>
<latest>now</latest>
</search>
<option name="drilldown">none</option>
</table>
</panel>
</row>
</form>
I hope this helps!!! Kindly upvote if it does!!