Svelte Datatable screenshot

Svelte Datatable

Author Avatar Theme by Kiho
Updated: 10 Nov 2022
107 Stars

DataTable for Svelte with Materialize

Overview

The Svelte Datatable project is a powerful tool for creating data tables and implementing various features like sorting, pagination, searching, and exporting. It is built on top of the Svelte framework and follows the Material Design specifications. The project was originally converted from the MicroDroid/vue-materialize-datatable project and the vuejs-paginate project. While it has limited support for IE 11 and requires the use of materialize-css, it offers a flexible and customizable solution for displaying and manipulating data.

Features

  • Sorting: Allows sorting of data in ascending or descending order.
  • Pagination: Supports pagination on both the client and server-side.
  • Fuzzy searching: Provides a search function that allows users to find specific data using fuzzy search.
  • Excel export: Enables the exporting of table data to Excel format.
  • Printing: Offers the ability to print the data table for easy reference or sharing.
  • Custom topbar buttons: Allows the addition of custom buttons to the top bar for performing specific actions.
  • Flexible data-from-row extractor: Provides flexibility in extracting data from each row for display or manipulation.
  • Follows Material Design spec: Adheres to the Material Design specifications for a visually consistent and modern look.

Installation

To get started with the Svelte Datatable, you will need to have Node.js installed. Once you have Node.js installed, follow these steps:

  1. Install the necessary dependencies:
npm install
  1. Start Rollup to build the project:
npm run dev
  1. Open your web browser and navigate to localhost:5000 to see the app running.

Summary

The Svelte Datatable project is a feature-rich tool for creating and manipulating data tables. It offers essential functionalities like sorting, pagination, searching, and exporting while following the Material Design specifications. The project requires the use of materialize-css library and has limited support for IE 11. Overall, it provides a customizable and flexible solution for displaying and managing data in a visually appealing way.