<zg-no-data>
The <zg-no-data>
tag is a web component that controls the styling and display of the message that appears to let the user know when no data has been loaded into a grid.
Related Web Components
Usage
A <zg-no-data>
tag can be manually inserted inside the grid as slotted content or automatically inserted when enabled via the nodata
attribute. The message is styleable via CSS variables or the zg-no-data
CSS selector.
You can insert <zg-no-data>
via the nodata
attribute, like so:
<zing-grid nodata="Hello No Data"></zing-grid>
You can slot the <zg-no-data>
tag as well:
<zing-grid> <zg-no-data>Hello No Data!</zg-no-data> </zing-grid>
Attributes
There are no attributes available for the <zg-no-data>
web component.
CSS Variables
<zg-no-data>
can be styled with CSS variables, like so:
root: { --zg-no-data-background: red; }
Below is a list of all the associated --zg-no-data
CSS variables. Check out the full list of CSS variables or our Styling Basics guide to learn more about styling the grid.
Name | Default | Description | Demo | CSS Ref |
---|
CSS Selector
<zg-no-data>
can be styled by common CSS selectors, like so:
zg-no-data { background: red; }