Dashboards & Visualizations

Java script to have return with wildcards

Rukmani_Splunk
Path Finder

Hi I am using java script to change teh column value color in splunk …

var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
          canRender: function (cell) {
              return _('source').contains(cell.field);
          },

i want this with wildcard like this column to have any value before

var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
          canRender: function (cell) {
              return _('*source').contains(cell.field);
          },
Labels (1)
0 Karma
1 Solution

kamlesh_vaghela
SplunkTrust
SplunkTrust

@Rukmani_Splunk 

Can you please try this?

canRender: function(cell) {
            var _lst = cell.field.match('.*source') // Provide your matching criteria
            var _other_lst = ['A', 'Version', 'Version_A'] // In case you have additional Column List
            var list = $.merge(_lst ? _lst : [], _other_lst)
            return _(list).contains(cell.field);
        },

 

KV 

View solution in original post

Rukmani_Splunk
Path Finder

Hi  Thanks for your response .. But  it  has not  worked for me.

 

My  table is like

sourcetype      source    time::count 

web file             access        20

 

my   dashboard is like 

dashboard script="table_high2.js" stylesheet="test.css">
<label>test1</label>
<row>
<panel>
<html>
<style>
.css_for_green{
background-color:#65A637 !important;
}
.css_for_yellow{
background-color:#FFFF00 !important;
}
.css_for_red{
background-color:#FF0000 !important;
}
.css_for_grey{
background-color:#EEE000 !important;
}

</style>
</html>
<table id="tableWithColorBasedOnAnotherField">
<search>
<query>index=_internal |stats count by sourcetype,source | rename count as "time::count" </query>
<earliest>-24h@h</earliest>
<latest>now</latest>
<sampleRatio>1</sampleRatio>
</search>
<option name="count">20</option>
<option name="dataOverlayMode">none</option>
<option name="drilldown">row</option>
<option name="percentagesRow">false</option>
<option name="rowNumbers">false</option>
<option name="totalsRow">false</option>
<option name="wrap">true</option>

 

Java script  based on your input 

require([
'underscore',
'jquery',
'splunkjs/mvc',
'splunkjs/mvc/tableview',
'splunkjs/mvc/simplexml/ready!'
], function (_, $, mvc, TableView) {

var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
canRender: function(cell) {
var list = cell.field.match('*count') // Provide your matching criteria

return _(list).contains(cell.field);
},

render: function ($td, cell) {

var val = cell.value;

if (val < 5) {
$td.addClass("range-cell").addClass("css_for_green")
}
else if (val <10) {
$td.addClass("range-cell").addClass("css_for_yellow")
}
else if (val > 20 ) {
$td.addClass("range-cell").addClass("css_for_red")
}

}
});

var sh = mvc.Components.get("tableWithColorBasedOnAnotherField");
if (typeof (sh) != "undefined") {
sh.getVisualization(function (tableView) {
// Add custom cell renderer and force re-render
tableView.table.addCellRenderer(new CustomRangeRenderer());
tableView.table.render();
});
}

var sh = mvc.Components.get("tableWithColorBasedOnAnotherField1");
if (typeof (sh) != "undefined") {
sh.getVisualization(function (tableView) {
// Add custom cell renderer and force re-render
tableView.table.addCellRenderer(new CustomRangeRenderer());
tableView.table.render();
});
}
});

 

Sourcetype 

0 Karma

kamlesh_vaghela
SplunkTrust
SplunkTrust

@Rukmani_Splunk 

var list = cell.field.match('.*count')

 instead of 

var list = cell.field.match('*count')

 

It's working for me.

Screenshot 2021-08-21 at 10.21.34 AM.png

KV

 

kamlesh_vaghela
SplunkTrust
SplunkTrust

@Rukmani_Splunk 

Can you please try this?

canRender: function(cell) {
            var _lst = cell.field.match('.*source') // Provide your matching criteria
            var _other_lst = ['A', 'Version', 'Version_A'] // In case you have additional Column List
            var list = $.merge(_lst ? _lst : [], _other_lst)
            return _(list).contains(cell.field);
        },

 

KV 

Rukmani_Splunk
Path Finder

Hi  Thanks a lot for your patience . But  i  get  the  belwo  error when ever  i  check  the developer tools.

"is not defined
at child.canRender "

0 Karma

kamlesh_vaghela
SplunkTrust
SplunkTrust

@Rukmani_Splunk 

Can you please share you code and sample Output of your search?

0 Karma

Rukmani_Splunk
Path Finder

i  havent cleared the history and it  worked  thanks a lot  ..

u r a genius :):):).. i  will  accept  it as solution  .. will  this one for two  fields

 

var test1 = cell.field.match('.*count') // Provide your matching criteria

var test2 = cell.field.match('.*count1')

var list = $.merge(test1 ? test1 : [], test2)

return _(list).contains(cell.field);

0 Karma

kamlesh_vaghela
SplunkTrust
SplunkTrust

@Rukmani_Splunk 

Just replace 

var list = $.merge(test1 ? test1 : [], test2)

with

var list = $.merge(test1 ? test1 : [], test2 ? test2 : [])

 

:slightly_smiling_face:

KV

 

Get Updates on the Splunk Community!

See just what you’ve been missing | Observability tracks at Splunk University

Looking to sharpen your observability skills so you can better understand how to collect and analyze data from ...

Weezer at .conf25? Say it ain’t so!

Hello Splunkers, The countdown to .conf25 is on-and we've just turned up the volume! We're thrilled to ...

How SC4S Makes Suricata Logs Ingestion Simple

Network security monitoring has become increasingly critical for organizations of all sizes. Splunk has ...