SplunkJS search results not loading table every time

[yash07]

The following is my JS code

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

    var mySearch = splunkjs.mvc.Components.getInstance("main_search");

    var myResults = mySearch.data("results");
    myResults.on("data", function(){
        allFields = myResults.data().fields;
        filteredFields = allFields.filter(field => !consistentFields.includes(field));        
    });
    var filteredFields;

    var consistentFields = ["Field 1", "Field 2", "Field 3" ];


    var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
        canRender: function(cell) {
            return true;
        },
        render: function($td, cell) {
            
            if(filteredFields.includes(cell.field)){
                if (cell.value === "Failure") {
                    $td.addClass("failure");
                }
                else if (cell.value === "Warn") {
                    $td.addClass("warn");
                }
                else if (cell.value === "Success") {
                    $td.addClass("success");
                }
            }
            // Update the cell content
            $td.text(cell.value).addClass("string");
        }
    });
    mvc.Components.get("main_table").getVisualization(function(tableView) {
        // Add custom cell renderer, the table will re-render automatically.
        tableView.addCellRenderer(new CustomRangeRenderer());
    }); 
});

I am not having the table load every time as I look at my console and I am getting the following error message

Uncaught TypeError: myResults.data() is undefined

This issue is my hunch for why my code works but not every single time since the page won't necessarily load.

[niketn]

Can you add further details for code with table with id main_table and search with id main_search? Is the search linked with the table i.e. present within table? Try to put the following at the beginning of your code and step through each JS debug step in Browser or Debugger of your preference to see which step is actually failing.

console.log("Script Loaded");

Most important part is whether it is entering table render code and classes are being added or not.

If you are using code from the following post you may also have to ensure that null fields are handled in SPL using fillnull.

https://community.splunk.com/t5/Dashboards-Visualizations/How-can-I-get-the-Table-cell-colorization-...
or 
https://community.splunk.com/t5/Splunk-Search/Add-colors-to-a-table-for-dynamic-columns/td-p/411419