Skip to content

Fully customizable Fastest Rendering Excel Style React Table supports Searching , Sorting, Filtering, Export , Import , Add, Edit and Delete

Notifications You must be signed in to change notification settings

ineffablep/react-enterprise-table

Repository files navigation

react-enterprise-table

npm install react-enterprise-table --save

React JS Enterprise Grade Table

  • Support Excel Style Filtering
  • Excel Style Sorting
  • Client Side and Server Side Filtering and Sorting
  • Global Search
  • Export to CSV
  • Upload File with Data
  • Add new records, Edit and Delete Records

Coming Features

  • Full Documentation with Examples
  • Re-Ordering of Rows
  • Re-Sizing Columns
  • Hierarchical Data Grid
  • Pivot Grid
  • Batch Edit
  • Copy and Paste Data to Grid

Sample to Use

import React, { Component } from 'react';
import Table from 'react-enterprise-table';
const pageData = (data, page, limit) => {
  if (page < 1) {
    page = 1;
  }
  let total = Math.round(data.length / limit);
  if (page > total) {
    page = total;
  }
  let from = (page - 1) * limit,
    to = page * limit;

  return data.slice(from, to);
};
class App extends Component {
  render() {
    const columns = [{
      id: 'fname',
      dataType: 'text',
      name: 'Full Name'
    },
    {
      id: 'dob',
      dataType: 'date',
      name: 'Date of Birth'
    }, {
      id: 'age',
      dataType: 'number',
      name: 'Age'
    }];
    const data = [];
    for (let i = 1; i < 100; i++) {
      let dt = new Date(),
        age = 35 + i;
      dt.setFullYear(dt.getFullYear() - age);
      data.push(
        { fname: 'Test ' + i, dob: dt, age: age },
      );
    };
    const pagination = {
      limit: 20,
      totalRows: 99,
      currentPage: 1,
      size: [20, 40, 60, 80, 100],
      onPagerClick: pageData
    };
    return (
      <div className="App">
        <Table columns={columns} data={data} pagination={pagination} />
      </div>
    );
  }
}

export default App;

About

Fully customizable Fastest Rendering Excel Style React Table supports Searching , Sorting, Filtering, Export , Import , Add, Edit and Delete

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published