Dashboards & Visualizations

How to highlight or change the color of a selected value in a table when clicked by the user?



I have created a dashboard using a form.
I have a table having 3 columns with multiple rows.

Also, i have created a drilldown search below it. The search runs according to value selected (clicked) in above table.
Now, to enhance user experience, I want to highlight/display/change color of value on which the user clicked.

Kindly advise.

0 Karma


Using custom Javascript with CSS could work here.
Details: http://docs.splunk.com/Documentation/Splunk/6.2.2/Viz/CustomizeSimpleXML

code not tested


.highlighted-cell {
   background-color: red !important;


// row1: since your dashboard is devided by rows (starting with 1), your table should reside in a certain row. 
var lastTd=$("#someNotExistentDiv");
$("#row1").find('td').click( function() {
  } );

You have to add both files to $SPLUNK_HOME$/etc/apps/myCoolApp/appserver/static. After adding the files you need to restart Splunk. To make sure changes within a file (splunk already knows, since you restarted splunk) takes place, you could call a debug refresh: within a browser open your equivalent of: http_//SPLUNKSERVER:8000/en-GB/debug/refresh. Moreover to know upon what your dashboard behaves: having the dashboard open, look into the dev-tools of your browser, open the loaded sources (looking for your CSS / JS file) and within that file look at the position of your last changes.

0 Karma
Did you miss .conf21 Virtual?

Good news! The event's keynotes and many of its breakout sessions are now available online, and still totally FREE!