Dashboards & Visualizations

Javascript for highlight text in table - Page Loading issue -How to fix it

New Member


I'm trying to highlight the text in the cell, for the searched text . I have created a table where the count of the ticket will be shown and clicking on the count, displays the details of the ticket. Now the searched word is highlighted in the table cell, but when there is a pagination, it shows randomly (i.e - first page will be blank, but in the 2 or 3rd page the data will be shown,etc..} When exported all the mentioned count of the ticket details are shown in the excel.

Below is the javascript

            ], function(_, $, mvc, TableView) {
                 var CustomIconRenderer = TableView.BaseCellRenderer.extend({
                     canRender: function(cell) {
                        return _(['column name1','column name2']).contains(cell.field);
                     render: function($td, cell) {

                                                var check = "column name1";
                         var hltext;
                        if(check === 'column name1') {
                                                            hltext = ["sample", "run", "test"];
                                                else if(cCheck === 'column name2'){
                                      hltext = ["is", "are"];
                           var i;
                           var strText=cell.value;
                           for (i = 0; i < hltext.length; i++)
                         var regEx = new RegExp(hltext[i], "gi");
                       //Apply regular expression to replace Filter Text with html content bold font and red color
                         strText=strText.replace(regEx, '<b style="color:red;">$&</b>');
                 mvc.Components.get('myTable').getVisualization(function(tableView) {      
                     // Add custom cell renderer, the table will re-render automatically.
                     tableView.addCellRenderer(new CustomIconRenderer());

It would be great ,if the issue is fixed. Had searched for the solution everywhere, have'nt got how to fix the same.

0 Karma

@careanitha @kranitha I had posted this code snippet way back as an answer https://answers.splunk.com/answers/636948/how-to-add-css-class-to-table-field-by-input-in-sp.html

Null values in Table cell rendering cause an issue, refer to one of other answers where table cell render was extended based on another cell but it would not work if required table cell had null value. https://answers.splunk.com/answers/686288/how-do-you-highlight-a-table-cell-based-on-a-field.html

Do upvote the question and accept the answer if they have helped you!

| makeresults | eval message= "Happy Splunking!!!"


@niketnilay- THANKS FOR YOUR quick reply.
Meanwhile can please share your comments on the below link for an issue in monitoring console

0 Karma



Fixed the issue - In the search query , the table will was created, no data for few columns, due to which the page was not loading properly and highlight was render in some or the other page. On adding
| fillnull value=0, the page was loading properly and highlighted the text in all pages.

0 Karma
Get Updates on the Splunk Community!

Last Chance to Submit Your Paper For BSides Splunk - Deadline is August 12th!

Hello everyone! Don't wait to submit - The deadline is August 12th! We have truly missed the community so ...

Ready, Set, SOAR: How Utility Apps Can Up Level Your Playbooks!

 WATCH NOW Powering your capabilities has never been so easy with ready-made Splunk® SOAR Utility Apps. Parse ...

DevSecOps: Why You Should Care and How To Get Started

 WATCH NOW In this Tech Talk we will talk about what people mean by DevSecOps and deep dive into the different ...