π
π
π
π
DataGrid Documentation
Searchβ¦
π
π
π
π
DataGrid Documentation
Getting Started
Buy DataGrid on CodeCanyon
Controls
Text Filter
Sort DropDown Control
Sort Button Control
Checkbox Filter
Radio Button Filter
Select Filter
Button Filter
Pagination
Page Size Control
Label Control
Multiple version of the same control (data-id attribute)
Languages Support
Special Classes
Deep Links
Storage
Multiple DataGrids on Page
How To
How To Sort Table in JavaScript
HTML Table with Sortable Headers
How to Filter HTML Table By Multiple Columns
Double Sort (Multiple Column Ordering)
Powered By
GitBook
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!
Controls - Previous
Page Size Control
Next
Multiple version of the same control (data-id attribute)
Last modified
1yr ago
Copy link
Contents