#### Datatables - Data Sources

Statistics Invoices Schedule

##### HTML (DOM) sourced data

Basic example of a datatable with `HTML (DOM)` sourced data. The foundation for DataTables is progressive enhancement, so it is 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 with basic configuration on it.

Name | Position | Age | Start date | Salary | Actions
--- | --- | --- | --- | --- | ---
Tiger Nixon | System Architect | 61 | 2011/04/25 | $320,800 |
Garrett Winters | Accountant | 63 | 2011/07/25 | $170,750 |
Ashton Cox | Junior Technical Author | 66 | 2009/01/12 | $86,000 |
Cedric Kelly | Senior Javascript Developer | 22 | 2012/03/29 | $433,060 |
Airi Satou | Accountant | 33 | 2008/11/28 | $162,700 |
Brielle Williamson | Integration Specialist | 61 | 2012/12/02 | $372,000 |
Herrod Chandler | Sales Assistant | 59 | 2012/08/06 | $137,500 |
Rhona Davidson | Integration Specialist | 55 | 2010/10/14 | $97,900 |
Colleen Hurst | Javascript Developer | 39 | 2009/09/15 | $405,500 |
Sonya Frost | Software Engineer | 23 | 2008/12/13 | $103,600 |
Jena Gaines | Office Manager | 30 | 2008/12/19 | $90,560 |
Quinn Flynn | Support Lead | 22 | 2013/03/03 | $342,000 |
Charde Marshall | Regional Director | 36 | 2008/10/16 | $470,600 |
Haley Kennedy | Senior Marketing Designer | 43 | 2012/12/18 | $113,500 |
Tatyana Fitzpatrick | Regional Director | 19 | 2010/03/17 | $385,750 |

##### 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 initialisation object, passing in an `array` of data to be used. This examples shows the element being added by Javascript and then initialising the DataTable with a set of data from a Javascript `array`.

Engine | Browser | Platform | Version | Grade
--- | --- | --- | --- | ---

##### 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. The example below shows DataTables loading data for a table from `arrays` as the data source (object parameters can also be used through the `columns.data` option).

Name | Position | Location | Extn. | Start date | Salary
--- | --- | --- | --- | --- | ---

##### Nested object data

The information read from an `Ajax` data source can be arbitrarily complex, but still be displayed by DataTables through the `columns.data` option, which is particularly useful for working with `JSON` feeds in an already defined format. The `columns.data` option has the ability to read information not only from objects, but also from arrays using the same dotted object syntax as for objects.

Name | Position | Office | Extn. | Start date | Salary
--- | --- | --- | --- | --- | ---

##### Generated content for a column

In some tables you might wish to have some content generated automatically. This examples shows the use of `columns.defaultContent` to create a button element in the last column of the table. A simple jQuery `click` event listener is used to watch for clicks on the row, and when activated uses the `row().data()` method to get the data for the row and show a bit of information about it in an alert box.

Name | Position | Office | Extn. | Start date | Salary
--- | --- | --- | --- | --- | ---