Material Design Lite Datatable - Material Design Lite

What is Material Design Lite Datatable?

The MDL data table offers numerous CSS classes to apply various predefined visual and behavioral enhancements to the display a table as data-table. Here’s the available classes and their effects.
S.N.
Class Name & Description
1
mdl-data-table
Identifies table as an MDL component and is required on table element.
2
mdl-js-data-table
Supports basic MDL behavior to table and is required on table element.
3
mdl-data-table--selectable
Supports all/individual selectable behavior (checkboxes) and is optional; goes on table element.
4
mdl-data-table__cell--non-numeric
Supports text formatting to data cell and is optional; goes on both table header and table data cells.
5
(none)
By default, supports the numeric formatting to header or data cell.

Example

Below mentioned example showcases the use of mdl-data-table classes to show a data table.
mdl_data_tables.htm

Result

Verify the result.

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

Material Design Lite Topics