Label Control
The label control is used to print information about the current page state. For example, it may be the selected page number or the total page number.
1
<div
2
data-grid-control="label"
3
data-type="pagination-pages">
4
</div>
Copied!
Data Attribute
Value
Description
Required
data-grid-control
label
This attribute defines the control type.
Required
data-type
  • pagination-pages
  • pagination-items
  • no-results
Label type.
Optional

Label Types

Type
Example
pagination-pages
Page 1 of 3
pagination-items
1 - 12 of 36
no-results
No results found.

No results label

This label appears when the total number of items becomes zero.
1
<div
2
data-grid-control="label"
3
data-type="no-results"
4
data-text="No results found.">
5
</div>
Copied!

Custom label

It is possible to create a custom label using the following callback function:
1
<script>
2
datagrid({
3
// render custom label HTML
4
renderLabelControl: function(state, $control){
5
return 'any custom html';
6
}
7
});
8
</script>
Copied!
If the label is empty, it has a dg-label-empty CSS class. This way, it's possible to add special styles:
1
.dg-label-empty{
2
display: none;
3
}
Copied!
Last modified 11mo ago
Copy link