Navbar:

##### Data Table

UI elements

##### Datatables

DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, build upon the foundations of progressive enhancement, that adds all of these advanced features to any HTML table.

Zero configuration

DataTables has most features enabled by default, so all you need to do to use it with your own ables is to call the construction function: $().DataTable();.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Feature enable / disable

Disabling features that you don't wish to use for a particular table is easily done by setting a variable in the initialisation object. The full list of available options is available in the DataTables reference.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
Id | Name | Position | Office | Age | Start data | Salary

Default ordering (sorting)

With DataTables you can alter the ordering characteristics of the table at initialisation time. Using the order initialisation parameter, you can set the table to display the data in exactly the order that you want.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Multi-column ordering

DataTables allows ordering by multiple columns at the same time, which can be activated in a number of different ways.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Responsive Data Table

In the modern world of responsive web design tables can often cause a particular problem for designers due to their row based layout. Responsive is an extension for DataTables that resolves that problem by optimising the table's layout for different screen sizes through the dynamic insertion and removal of columns from the table.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Hidden columns

There are times when you might find it useful to display only a sub-set of the information that was available in the original table. For example you might want to reduce the amount of data shown on screen to make it clearer for the user (consider also using the Responsive extension for this). This is done through the columns.visible column option.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Complex headers (rowspan and colspan)

When using tables to display data, you will often wish to display column information in groups. DataTables fully supports `colspan` and `rowspan` in the table's header, assigning the required order listeners to the TH element suitable for that column.

Id | HR Information | Contact
--- | --- | ---
Name | Position | Office | Age | Start data | Salary
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

DOM positioning

When customising DataTables for your own usage, you might find that the default position of the feature elements (filter input etc) is not quite to your liking. To address this issue DataTables takes inspiration from the CSS 3 Advanced Layout Module and provides the dom initialisation parameter which can be set to indicate where you wish particular features to appear in the DOM. You can also specify `div` wrapping containers (with an id and / or class) to provide complete layout flexibility.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Alternative pagination

The default page control presented by DataTables (forward and backward buttons with up to 7 page numbers in-between) is fine for most situations, but there are cases where you may wish to customise the options presented to the end user. This is done through DataTables' extensible pagination mechanism, the pagingType option.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Individual column searching

The searching functionality provided by DataTables is useful for quickly search through the information in the table - however the search is global, and you may wish to present controls that search on specific columns.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Scroll - vertical

This example shows the DataTables table body scrolling in the vertical direction. This can generally be seen as an alternative method to pagination for displaying a large table in a fairly small vertical area, and as such pagination has been disabled here (note that this is not mandatory, it will work just fine with pagination enabled as well!).

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Scroll - vertical, dynamic height

This example shows a vertically scrolling DataTable that makes use of the CSS3 `vh` unit in order to dynamically resize the viewport based on the browser window height. The `vh` unit is effectively a percentage of the browser window height. So the `50vh` used in this example is 50% of the window height. The viewport size will update dynamically as the window is resized.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Scroll - horizontal

DataTables has the ability to show tables with horizontal scrolling, which is very useful for when you have a wide table, but want to constrain it to a limited horizontal display area. To enable x-scrolling simply set the scrollX parameter to be whatever you want the container wrapper's width to be (this should be 100% in almost all cases with the width being constrained by the container element).

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Scroll - horizontal and vertical

In this example you can see DataTables doing both horizontal and vertical scrolling at the same time. Note also that pagination is enabled in this example, and the scrolling accounts for this.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Language - Comma decimal place

A dot (.) is used to mark the decimal place in Javascript, however, many parts of the world use a comma (,) and other characters such as the Unicode decimal separator (⎖) or a dash (-) are often used to show the decimal place in a displayed number.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary

Language options

Changing the language information displayed by DataTables is as simple as passing in a `language` object to the DataTable constructor.

Id | Name | Position | Office | Age | Start data | Salary
--- | --- | --- | --- | --- | --- | ---
1 | Maruf Ahmed | Front End Developer | Dhaka | 20 | 2019/12/12 | $500,800
2 | Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800
3 | Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600
4 | Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900
5 | Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000
6 | Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560
7 | Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500
8 | Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750
9 | Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500
10 | Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433060
11 | Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000
12 | Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000
13 | Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700
Id | Name | Position | Office | Age | Start data | Salary