A simple and powerful Datatable for React based on Material-UI Table with some additional features.
- Actions
- Component overriding
- Custom rendering
- Detail Panel
- Editable
- Export
- Filtering
- Grouping
- Localization
- Remote Data
- Search
- Selection
- Sorting
- Styling
- Tree Data
- and more
You can access all examples and documentation from docs site.
To install material-table with npm
:
npm install material-table --save
To install material-table with yarn
:
yarn add material-table
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
or use icons
props to give icons to material-table
import React, { Component } from 'react'
import ReactDOM from 'react-dom'
import MaterialTable from 'material-table'
class App extends Component {
render() {
return (
<div style={{ maxWidth: '100%' }}>
<MaterialTable
columns={[
{ title: 'Adı', field: 'name' },
{ title: 'Soyadı', field: 'surname' },
{ title: 'Doğum Yılı', field: 'birthYear', type: 'numeric' },
{ title: 'Doğum Yeri', field: 'birthCity', lookup: { 34: 'İstanbul', 63: 'Şanlıurfa' } }
]}
data={[{ name: 'Mehmet', surname: 'Baran', birthYear: 1987, birthCity: 63 }]}
title="Demo Title"
/>
</div>
)
}
}
ReactDOM.render(<App />, document.getElementById('react-div'));
We'd love to have your helping hand on material-table
! See CONTRIBUTING.md for more information on what we're looking for and how to get started.
If you have any sort of doubt, idea or just want to talk about the project, feel free to join our chat on Gitter :)
This project is licensed under the terms of the MIT license.