No empty message capability

[jadrake75]

The grid should be able to display a message / row of text in the grid if there is no content in the data array. Something like "No xxx found" etc. This is consistent with other grids available. I could swing this with a directive and showing/hiding a div in ngViewport but it would be better if this was provided as part of the component.

[jadrake75]

In case anyone is looking for a quick solution here, what I did was create a simple directive that I added to my div that declares the ng-grid called "show-empty-msg". It looks like the following:

tables.directive('showEmptyMsg', function ($compile, $timeout) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var msg = (attrs.showEmptyMsg) ? attrs.showEmptyMsg : 'Nothing to display';
var template = "<div class="empty-msg" ng-show="data.length===0">" + msg + "";
var tmpl = angular.element(template);
$compile(tmpl)(scope);
$timeout(function () {
element.find('.ngViewport').append(tmpl);
}, 0);
}
};
});

Then you can all it like so:

My directive does make the assumption that your grid data is in a variable "data" (which all of mine are)

[dlsmartins]

jadrake 75, can you please provide a plunker? I've not been able to create the desired effect using your snippet...

[tamlyn]

+1 for having this functionality built in.

Here's @jadrake75's snippet with the HTML preserved:

.directive('showEmptyMsg', function ($compile, $timeout) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var msg = (attrs.showEmptyMsg) ? attrs.showEmptyMsg : 'Nothing to display';
            var template = "<p ng-hide='data.length'>" + msg + "</p>";
            var tmpl = angular.element(template);
            $compile(tmpl)(scope);
            $timeout(function () {
                element.find('.ngViewport').append(tmpl);
            }, 0);
        }
    };
})

Replace data.length with whatever is appropriate in your case.

[sryzycki]

Hey guys. I'd like to upvote this feature but this time for ui-grid 4.x.

The ng-transclude method is great but to display a "no results" text below the table header you'd need to know its height in pixels which vary depending on filters that are displayed.

It would be nice to have an "input" property available e.g on the <div ui-grid ui-grid-message="$ctrl.emptyListMessage"></div>. If it's set, it's shown.

I could create a PR if you guys point me at the right direction.