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 ...

Built-in Service Level Objectives Management to Bridge the Gap Between Service & ...

Wednesday, May 29, 2024  |  11AM PST / 2PM ESTRegister now and join us to learn more about how you can ...

Get Your Exclusive Splunk Certified Cybersecurity Defense Engineer Certification at ...

We’re excited to announce a new Splunk certification exam being released at .conf24! If you’re headed to Vegas ...