zg-text

ZingGrid has a predefined set of attribute values to display information about the grid state. <zg-text> is a self contained webcomponent so you can display the value anywhere in the grid.

Usage

The most important tag in the library. Contains most of the attributes to turn grid features on/off. Set zing-grid:not(:defined) {display:none;} to hide <zing-grid>instances until they are ready. This stops child elements from appearing unstyled for a brief moment.

Example Usage

<zg-footer>
  <div>
    <span>Showing</span>
    <zg-text value="currpage"></zg-text>
    <span>-</span>
    <zg-text value="pagecount"></zg-text>
    <span>of</span>
    <zg-text value="pagecount"></zg-text>
    <span>rows</span>
  </div>
  <div>
    <zg-button action="prevpage"></zg-button>
    <zg-text value="currpage"></zg-text>
    <zg-button action="nextpage"></zg-button>
  </div>
</zg-footer>

Type Values

The accepted values for the type (zg-text type="") attribute.

zg-text `type` Values
Name	Description	Demo
currpage	Display the current page of the grid.
pagecount	Display the total amount of pages in the grid.
pagesize	Display the current `page-size` of the grid.
startrow	Display the current starting row index, of the current page, in the grid.
endrow	Display the current end row index, of the current page, in the grid.
rowcount	Display the total amount of rows in the grid.