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 : [])

 

🙂

KV

 

Get Updates on the Splunk Community!

Webinar Recap | Revolutionizing IT Operations: The Transformative Power of AI and ML ...

The Transformative Power of AI and ML in Enhancing Observability   In the realm of IT operations, the ...

.conf24 | Registration Open!

Hello, hello! I come bearing good news: Registration for .conf24 is now open!   conf is Splunk’s rad annual ...

ICYMI - Check out the latest releases of Splunk Edge Processor

Splunk is pleased to announce the latest enhancements to Splunk Edge Processor.  HEC Receiver authorization ...