Dashboards & Visualizations

Hiding panel with no results in advanced xml

lgmnemesis
Explorer

Hi,
Is there a way of hiding / not displaying panels that returns no results? maybe using css or application.js ??

I have a view containing several panels that in some cases, a few searches will not return any result, so i want to be able to hide those panels at that time.

Thank you.

Tags (1)
1 Solution

jonuwz
Influencer

Yeah.

Put this in application.js :

$(document).ajaxComplete( function() {

    $('p.empty_results').closest('.dashboardCell').css('display', 'none');
});

You need to use ajaxComplete because the p.empty_results doesn't exist until the search completes, long after the $(document).ready

This works provided you have 1 search per dashboard cell, and works best if there's 1 cell per row.

If there's more then 1 cell per row, and you like nice looking pages, you'd need to alter the width of the other cells in the row to accomodate any missing cells (i.e 3 cells in a row, you hide one because there's no results, so you need to increase the width from 33% to 50% for the remainder)

Update

Just because you felt fit to throw the extra rep ... This deals with resizing the remaining cells

$(document).ajaxComplete( function() {

    $('p.empty_results').closest('.layoutCell').each(function(){

        var that = this;
        var parent=$(this).parent();
        var classList =$(parent).attr('class').split(/\s+/);
        $.each( classList, function(index, item){

            switch (item) {
                case 'oneColRow':
                    $(parent).remove();
                    break;
                case 'twoColRow':
                    $(that).remove();
                    $(parent).removeClass('twoColRow').addClass('oneColRow');
                    break;
                case 'threeColRow':
                    $(that).remove();
                    $(parent).removeClass('threeColRow').addClass('twoColRow');
                    break;
            }
        });

    });

});

PS - marking answers as accepted, is the usual way to assign rep : )

View solution in original post

jonuwz
Influencer

Yeah.

Put this in application.js :

$(document).ajaxComplete( function() {

    $('p.empty_results').closest('.dashboardCell').css('display', 'none');
});

You need to use ajaxComplete because the p.empty_results doesn't exist until the search completes, long after the $(document).ready

This works provided you have 1 search per dashboard cell, and works best if there's 1 cell per row.

If there's more then 1 cell per row, and you like nice looking pages, you'd need to alter the width of the other cells in the row to accomodate any missing cells (i.e 3 cells in a row, you hide one because there's no results, so you need to increase the width from 33% to 50% for the remainder)

Update

Just because you felt fit to throw the extra rep ... This deals with resizing the remaining cells

$(document).ajaxComplete( function() {

    $('p.empty_results').closest('.layoutCell').each(function(){

        var that = this;
        var parent=$(this).parent();
        var classList =$(parent).attr('class').split(/\s+/);
        $.each( classList, function(index, item){

            switch (item) {
                case 'oneColRow':
                    $(parent).remove();
                    break;
                case 'twoColRow':
                    $(that).remove();
                    $(parent).removeClass('twoColRow').addClass('oneColRow');
                    break;
                case 'threeColRow':
                    $(that).remove();
                    $(parent).removeClass('threeColRow').addClass('twoColRow');
                    break;
            }
        });

    });

});

PS - marking answers as accepted, is the usual way to assign rep : )

lgmnemesis
Explorer

works like a charm!!
Again, thank you so much for your great help.

0 Karma

lgmnemesis
Explorer

Thanks!!, that did the trick.
As you mentioned, i do need to increase the width of my other cell.
my page has two cells (panels) per row and has several rows.
Is there a way of increasing the width of a cell in case its "companion" cell is not there any more?

0 Karma
Get Updates on the Splunk Community!

Introducing the Splunk Community Dashboard Challenge!

Welcome to Splunk Community Dashboard Challenge! This is your chance to showcase your skills in creating ...

Get the T-shirt to Prove You Survived Splunk University Bootcamp

As if Splunk University, in Las Vegas, in-person, with three days of bootcamps and labs weren’t enough, now ...

Wondering How to Build Resiliency in the Cloud?

IT leaders are choosing Splunk Cloud as an ideal cloud transformation platform to drive business resilience,  ...