Sources Datatable

HTML (DOM) Sourced Data

The foundation for DataTables is progressive enhancement, so it's very adept at reading table information directly from the DOM. This example shows how easy it is to add searching, ordering and paging to your HTML table by simply running DataTables on it.

Name

Position

Office

Age

Start date

Salary

Tiger Nixon

System Architect

Edinburgh

61

2011/04/25

$320,800

Garrett Winters

Accountant

Tokyo

63

2011/07/25

$170,750

Ashton Cox

Junior Technical Author

San Francisco

66

2009/01/12

$86,000

Cedric Kelly

Senior Javascript Developer

Edinburgh

22

2012/03/29

$433,060

Airi Satou

Accountant

Tokyo

33

2008/11/28

$162,700

Brielle Williamson

Integration Specialist

New York

61

2012/12/02

$372,000

Herrod Chandler

Sales Assistant

San Francisco

59

2012/08/06

$137,500

Rhona Davidson

Integration Specialist

Tokyo

55

2010/10/14

$327,900

Colleen Hurst

Javascript Developer

San Francisco

39

2009/09/15

$205,500

Sonya Frost

Software Engineer

Edinburgh

23

2008/12/13

$103,600

Jena Gaines

Office Manager

London

30

2008/12/19

$90,560

Quinn Flynn

Support Lead

Edinburgh

22

2013/03/03

$342,000

Charde Marshall

Regional Director

San Francisco

36

2008/10/16

$470,600

Haley Kennedy

Senior Marketing Designer

London

43

2012/12/18

$313,500

Tatyana Fitzpatrick

Regional Director

London

19

2010/03/17

$385,750

Michael Silva

Marketing Designer

London

66

2012/11/27

$198,500

Paul Byrd

Chief Financial Officer (CFO)

New York

64

2010/06/09

$725,000

Gloria Little

Systems Administrator

New York

59

2009/04/10

$237,500

Bradley Greer

Software Engineer

London

41

2012/10/13

$132,000

Dai Rios

Personnel Lead

Edinburgh

35

2012/09/26

$217,500

Name

Position

Office

Age

Start date

Salary

Ajax Sourced Data

DataTables has the ability to read data from virtually any JSON data source that can be obtained by Ajax. This can be done, in its most simple form, by setting the ajax option to the address of the JSON data source.

Name

Position

Office

Extn.

Start date

Salary

Name

Position

Office

Extn.

Start date

Salary

Javascript Sourced Data

At times you will wish to be able to create a table from dynamic information passed directly to DataTables, rather than having it read from the document. This is achieved using the data option in the initialization object, passing in an array of data to be used (like all other DataTables handled data, this can be arrays or objects using the columns.data option).

Server-Side Processing

Server-side processing is enabled by setting the serverSide option to true and providing an Ajax data source through the ajax option.