How can I change the text color for specific values in a multivalue field?

[sfatnass]

hi

I am trying to change the text color for a multivalued field.

I'm using cellrender like Splunk 6.x Dashboard Examples

For example:

My objective is to change the color for specific values on one multivalued field.

field1  |   field2
        |   7888
   A    |   1666
        |   3452

   B    |  5667
        |  8565

So to understand my aim, I represent my table like this: field2 is a multivalued field

if (field2.value == 7888), I just want to color only this value and not the cell with ($td).

How can I do this?

[sfatnass · Accepted solution]

hi VsplunkV,

for my problem to color a specific value within multivalued field, i overwrite the html content in source code by javascript implement.

require([
        'underscore',
        'jquery',
        'splunkjs/mvc',
        'splunkjs/mvc/tableview',
        'splunkjs/mvc/simplexml/ready!'
    ], function (_, $, mvc, TableView) {
        var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
            canRender: function (cell) {
                // Enable this custom cell renderer for both the active_hist_searches and the active_realtime_searches field
                return _(['fieldName1', 'fieldName2']).contains(cell.field);
            },
        render: function ($td, cell) {

            if (cell.field === 'fieldName1') {
                var valueDx = String(cell.value)
                var html_content = "";
                var tokens = [];
                var separators = ['\\,'];

                tokens = valueDx.split(new RegExp(separators.join('|'), 'g'));

                for (var i = 0; i < tokens.length; i++) {

                    var numbers = parseFloat(tokens[i].split(":")[1]);

                    if (numbers == 7888) {

                        html_content = html_content + "<div tabindex=\"0\" class=\"multivalue-subcell\" style=\"color:#E80C0C;\" data-mv-index=\"" + i + "\">" + tokens[i] + "</div>";

                    } else {

                        html_content = html_content + "<div tabindex=\"0\" class=\"multivalue-subcell\" data-mv-index=\"" + i + "\">" + tokens[i] + "</div>";
                    }
                }
                    $td.html(html_content).addClass('string');
            }
        }
    });

    mvc.Components.get("tableName").getVisualization(function (tableView) {
        // Add custom cell renderer, the table will re-render automatically.
        tableView.addCellRenderer(new CustomRangeRenderer());
    });

});

[VsplunkV]

Hi, Did you find the answer for this question Yet? I have similar situation.

Based on the Range, I need to set the different color. I am using 6.6.5 Version.

[sfatnass]

hi yes i did it.

i will add the answer tomorow

it's not difficult, i use the same cellrender for highlight and i overwrite the html content to get the good class.

so it's only javascript and css, don't worry about the version of splunk.
my solution work on 6.3.3 to 7