Drilldown with javascript in a table format and using a token

wvalente2 — Fri, 02 Feb 2024 21:37:09 GMT

Hi Splunkers,

I need a help with my dashboard because of I`m stuck in this problem. I`ve already search, tried many javascript codes and still not working.

Basically what I need is:

After clicking in a drilldown button , the result should be a table that show me more the details about a use case.

Look at the first down arrow. When I click it should show me the details. But I cannot render a table.

The token to mue results should be the value os the use_case_name.

My javascript code:

 requirejs([
'../app/simple_xml_examples/libs/underscore-1.6.0-umd-min',
'splunkjs/mvc/tableview',
'splunkjs/mvc/chartview',
'splunkjs/mvc/searchmanager',
'splunkjs/mvc',
'splunkjs/mvc/simplexml/ready!'
], function(_, TableView, ChartView, SearchManager, mvc) {
var EventSearchBasedRowExpansionRenderer = TableView.BaseRowExpansionRenderer.extend({
initialize: function() {
// initialize will run once, so we will set up a search and a chart to be reused.
this._searchManager = new SearchManager({
id: 'details-search-manager',
preview: false
});
this._tableView = new TableView({
'managerid': 'details-search-manager',
'charting.legend.placement': 'none'
});
},
canRender: function(rowData) {
// Since more than one row expansion renderer can be registered we let each decide if they can handle that
// data
// Here we will always handle it.
return true;
},
render: function($container, rowData) {
// rowData contains information about the row that is expanded. We can see the cells, fields, and values
// We will find the sourcetype cell to use its value
var use_case_nameCell = _(rowData.cells).find(function (cell) {
return cell.field === 'use_Case_name';
});
//update the search with the sourcetype that we are interested in
// this._searchManager.set({ search: 'index=_internal sourcetype=' + sourcetypeCell.value + ' | table user | dedup user' });
this._searchManager.set({ search: '| inputlookup XXXX.csv | search use_case_name=' + use_case_nameCell.value + ' | table XXX | transpose' });
// $container is the jquery object where we can put out content.
// In this case we will render our chart and add it to the $container
// $container.append(this._chartView.render().el);
$container.append(this._tableView.render().el);

}
});
var tableElement = mvc.Components.getInstance('expand_with_events');
tableElement.getVisualization(function(tableView) {
// Add custom cell renderer, the table will re-render automatically.
tableView.addRowExpansionRenderer(new EventSearchBasedRowExpansionRenderer());
tableView.table.render();
});
});

Thank you guys.

Re: Drilldown with javascript in a table format and using a token

kamlesh_vaghela — Tue, 13 Feb 2024 05:22:59 GMT

@wvalente2

Are you looking for this?

https://community.splunk.com/t5/Splunk-Dev/Table-row-expansion-with-dynamic-search-in-the-JS/m-p/561412

Please share more details of your requirements in case you need more details.

Thanks
KV
If any of my replies help you to solve the problem Or gain knowledge, an upvote would be appreciated.

topic Re: Drilldown with javascript in a table format and using a token in Dashboards & Visualizations

Drilldown with javascript in a table format and using a token

Re: Drilldown with javascript in a table format and using a token