{"id":21104,"library":"datatables.net","title":"DataTables","description":"DataTables is a powerful JavaScript library for enhancing HTML tables with advanced interaction controls such as pagination, instant search, multi-column sorting, and server-side processing. The current stable version is 2.3.8, released on a regular schedule with minor updates and patches. It requires jQuery as a dependency and provides a rich API for customizing table behavior. DataTables differentiates itself with extensive community support, numerous plugins, and seamless integration with jQuery. A major 3.0 beta is in development, which will introduce breaking changes and new features.","status":"active","version":"2.3.8","language":"javascript","source_language":"en","source_url":"https://github.com/DataTables/Dist-DataTables","tags":["javascript","Datatables","jQuery","table","filter","sort","typescript"],"install":[{"cmd":"npm install datatables.net","lang":"bash","label":"npm"},{"cmd":"yarn add datatables.net","lang":"bash","label":"yarn"},{"cmd":"pnpm add datatables.net","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"DataTables depends on jQuery for DOM manipulation and event handling.","package":"jquery","optional":false}],"imports":[{"note":"Default export provides the DataTable constructor. In CJS environments, use require('datatables.net') with CommonJS, but TypeScript types are designed for ESM default import.","wrong":"const DataTable = require('datatables.net')","symbol":"DataTable","correct":"import DataTable from 'datatables.net'"},{"note":"DataTables requires jQuery globally. Import jQuery separately and ensure it's loaded before DataTables.","wrong":"import DataTable from 'datatables.net'; (missing jQuery import)","symbol":"$","correct":"import $ from 'jquery'; import DataTable from 'datatables.net'"},{"note":"Config is a TypeScript type/interface. Use type-only import to avoid runtime errors.","wrong":"import { Config } from 'datatables.net' (runtime import)","symbol":"type Config","correct":"import type { Config } from 'datatables.net'"}],"quickstart":{"code":"import $ from 'jquery';\nimport DataTable from 'datatables.net';\n\nconst table = new DataTable('#myTable', {\n  paging: true,\n  searching: true,\n  ordering: true,\n  pageLength: 10,\n  serverSide: false,\n  columns: [\n    { data: 'name' },\n    { data: 'position' },\n    { data: 'office' },\n    { data: 'age' },\n    { data: 'salary' }\n  ],\n  data: [\n    { name: 'Tiger Nixon', position: 'System Architect', office: 'Edinburgh', age: 61, salary: '$320,800' },\n    { name: 'Garrett Winters', position: 'Accountant', office: 'Tokyo', age: 63, salary: '$170,750' }\n  ]\n});\n\nconsole.log(table.rows().count());","lang":"typescript","description":"Creates a new DataTable instance from an HTML table element with data, enabling pagination, search, and sorting."},"warnings":[{"fix":"Replace $(...).DataTable() with new DataTable(...) and import DataTable from 'datatables.net'.","message":"DataTables v2 drops the $.fn.dataTable jQuery API. Use the importable DataTable constructor instead.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Use new DataTable('#table') from the module instead.","message":"Using $('#table').DataTable() is deprecated in v2 and removed in v3 beta.","severity":"deprecated","affected_versions":">=2.0.0 <3.0.0"},{"fix":"Ensure jQuery is installed and imported: import $ from 'jquery'; then import DataTable.","message":"DataTables requires jQuery to be loaded before importing DataTable. Failing to do so results in a runtime error: 'jQuery is not defined'.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use webpack.ProvidePlugin to expose jQuery globally or use imports-loader.","message":"When using DataTables with webpack or similar bundlers, the default import might be undefined if jQuery is not properly provided.","severity":"gotcha","affected_versions":">=2.0.0"}],"env_vars":null,"search_vec":"'2.3.8':35 '3.0':77 'advanc':13 'api':56 'behavior':60 'beta':78 'break':85 'chang':86 'column':23 'communiti':66 'control':15 'current':31 'custom':58 'datat':1,2,61,91 'depend':51 'develop':81 'differenti':62 'enhanc':9 'extens':65 'featur':89 'filter':94 'html':10 'instant':19 'integr':72 'interact':14 'introduc':84 'javascript':6,90 'jqueri':48,74,92 'librari':7 'major':76 'minor':42 'multi':22 'multi-column':21 'new':88 'numer':68 'pagin':18 'patch':45 'plugin':69 'power':5 'process':29 'provid':53 'regular':39 'releas':36 'requir':47 'rich':55 'schedul':40 'seamless':71 'search':20 'server':27 'server-sid':26 'side':28 'sort':24,95 'stabl':32 'support':67 'tabl':11,59,93 'typescript':96 'updat':43 'version':33","created_at":"2026-04-27T16:58:06.399307+00:00","updated_at":"2026-04-27T16:58:06.399307+00:00","problems":[{"fix":"Use the module import: import DataTable from 'datatables.net'; new DataTable('#table');","cause":"Trying to call $(...).DataTable() without proper import or before jQuery is loaded.","error":"TypeError: (intermediate value).DataTable is not a function"},{"fix":"Run npm install jquery and import it before DataTables.","cause":"jQuery is not installed as a dependency.","error":"Error: Cannot find module 'jquery'"},{"fix":"Use import type { Config } from 'datatables.net' for TypeScript.","cause":"Trying to use import { Config } from 'datatables.net' at runtime instead of using type-only import.","error":"TS2322: Type 'undefined' is not assignable to type 'Config'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":"https://datatables.net","github":"https://github.com/DataTables/Dist-DataTables","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/datatables.net","openapi_spec":null,"status_page":null,"smithery":null,"categories":["web-framework"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-17","next_check":"2026-07-26","install_tag":null}}