{"id":13402721,"url":"https://github.com/frappe/datatable","last_synced_at":"2025-05-14T22:07:42.802Z","repository":{"id":26067079,"uuid":"106106209","full_name":"frappe/datatable","owner":"frappe","description":"The Missing Javascript Datatable for the Web","archived":false,"fork":false,"pushed_at":"2025-05-05T07:02:59.000Z","size":3288,"stargazers_count":1124,"open_issues_count":61,"forks_count":177,"subscribers_count":45,"default_branch":"master","last_synced_at":"2025-05-05T08:21:48.456Z","etag":null,"topics":["datagrid","datatable","datatables-library","editable-grid","editable-table","grid","interactive","modern","simple","table"],"latest_commit_sha":null,"homepage":"https://frappe.io/datatable","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/frappe.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2017-10-07T14:58:02.000Z","updated_at":"2025-05-05T07:01:19.000Z","dependencies_parsed_at":"2024-01-12T18:38:14.572Z","dependency_job_id":"7948969d-ae00-44e6-b3fe-af5584a7c080","html_url":"https://github.com/frappe/datatable","commit_stats":{"total_commits":318,"total_committers":19,"mean_commits":"16.736842105263158","dds":"0.19811320754716977","last_synced_commit":"dbde62ce401ed8107dbe98666c131d82d052e4c2"},"previous_names":[],"tags_count":89,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frappe%2Fdatatable","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frappe%2Fdatatable/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frappe%2Fdatatable/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frappe%2Fdatatable/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/frappe","download_url":"https://codeload.github.com/frappe/datatable/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254235696,"owners_count":22036963,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["datagrid","datatable","datatables-library","editable-grid","editable-table","grid","interactive","modern","simple","table"],"created_at":"2024-07-30T19:01:19.977Z","updated_at":"2025-05-14T22:07:37.787Z","avatar_url":"https://github.com/frappe.png","language":"JavaScript","readme":"\u003cdiv align=\"center\" markdown=\"1\"\u003e\n\n\u003cimg width=\"80\" alt=\"datatable-logo\" src=\"https://github.com/user-attachments/assets/8235f4b9-993a-4329-97de-9431dcf63aae\" \u003e\n\n\u003ch1\u003eFrappe DataTable\u003c/h1\u003e\n\n**A modern datatable library for the web**\n\n[![Test and Release](https://github.com/frappe/datatable/workflows/Test%20and%20Release/badge.svg)](https://github.com/frappe/datatable/actions?query=workflow%3A%22Test+and+Release%22)\n[![npm version](https://badge.fury.io/js/frappe-datatable.svg)](https://badge.fury.io/js/frappe-datatable)\n![npm bundle size (minified + gzip)](https://img.shields.io/bundlephobia/minzip/frappe-datatable.svg)\n\n\n![datatable-demo-2](https://user-images.githubusercontent.com/9355208/40740030-5412aa40-6465-11e8-8542-b0247ab1daac.gif)\n\n\u003c/div\u003e\n\n## Frappe Datatable\n\nFrappe DataTable is a simple, modern and interactive datatable library for displaying tabular data. Originally built for [ERPNext](https://github.com/frappe/erpnext), it can be used to render large amount of rows without sacrificing performance and has the basic data grid features like inline editing and keyboard navigation. It does not require jQuery, unlike most data grids out there.\n\n### Motivation\n\nI was trying to remove all legacy UI components from the [frappe](https://github.com/frappe/frappe) codebase. We were using [SlickGrid](https://github.com/mleibman/SlickGrid) for rendering tables. It was unmaintained and UI was dated. Other datatable solutions either didn't have the features we needed or were closed source. So we built our own.\n\n\n### Key Features\n\n- **Cell**: Enable editing within individual cells and features like custom formatters, inline editing, and mouse selection. Users can easily copy cell content, navigate through cells using the keyboard, and take advantage of a custom cell editor for advanced functionality.\n- **Column**: Columns are highly flexible, allowing users to reorder, resize, and sort them with ease. Additional features include hiding/removing columns and adding custom actions.\n- **Row**: Rows support advanced interactions, including row selection, tree-structured organization, and inline filters for precise control. They handle large datasets efficiently with dynamic row heights.\n\n\n## Usage\n\n```bash\nyarn add frappe-datatable\n# or\nnpm install frappe-datatable\n```\n\n\u003e Note: [`sortablejs`](https://github.com/RubaXa/Sortable) is required to be installed as well.\n\n\n```js\nconst datatable = new DataTable('#datatable', {\n  columns: [ 'First Name', 'Last Name', 'Position' ],\n  data: [\n    [ 'Don', 'Joe', 'Designer' ],\n    [ 'Mary', 'Jane', 'Software Developer' ]\n  ]\n});\n```\n\n## Development Setup\n\n* `yarn start` - Start dev server\n* Open `index.html` located in the root folder, and start development.\n* Run `yarn lint` before committing changes\n* This project uses [commitizen](https://github.com/commitizen/cz-cli) for conventional commit messages, use `yarn commit` command instead of `git commit`\n\n## Links\n\n- [Making a new datatable for the web](https://medium.com/frapp%C3%A9-thoughts/things-i-learned-building-a-library-for-the-web-6846a588bf53)\n\n\u003cbr\u003e\n\u003cbr\u003e\n\u003cdiv align=\"center\" style=\"padding-top: 0.75rem;\"\u003e\n\t\u003ca href=\"https://frappe.io\" target=\"_blank\"\u003e\n\t\t\u003cpicture\u003e\n\t\t\t\u003csource media=\"(prefers-color-scheme: dark)\" srcset=\"https://frappe.io/files/Frappe-white.png\"\u003e\n\t\t\t\u003cimg src=\"https://frappe.io/files/Frappe-black.png\" alt=\"Frappe Technologies\" height=\"28\"/\u003e\n\t\t\u003c/picture\u003e\n\t\u003c/a\u003e\n\u003c/div\u003e\n","funding_links":[],"categories":["JavaScript","Data Tables \u0026 Grids","Spreadsheet","Spreadsheet [🔝](#readme)","电子表格"],"sub_categories":["Runner","运行器","运行器e2e测试"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrappe%2Fdatatable","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffrappe%2Fdatatable","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrappe%2Fdatatable/lists"}