#### Datatables - Advanced

Statistics Invoices Schedule

##### Page length options

It is possible to easily customise the options shown in the length menu using the `lengthMenu` initialisation option. This parameter can take one of two forms: 1) A `1D` array of options which will be used for both the displayed option and the value; 2) A `2D` array in which the first array is used to define the value options and the second array the displayed options. The example below shows a 2D array being used to include a `"Show all"` records option.

First Name | Last Name | Job Title | DOB | Status | Actions
--- | --- | --- | --- | --- | ---
Marth | Enright | Traffic Court Referee | 22 Jun 1972 | Active |
Jackelyn | Weible | Airline Transport Pilot | 3 Oct 1981 | Inactive |
Aura | Hard | Business Services Sales Representative | 19 Apr 1969 | Suspended |
Nathalie | Pretty | Drywall Stripper | 13 Dec 1977 | Pending |
Sharan | Leland | Aviation Tactical Readiness Officer | 30 Dec 1991 | Inactive |
Maxine | Woldt | Business Services Sales Representative | 17 Oct 1987 | Pending |
Sylvia | Mcgaughy | Hemodialysis Technician | 11 Nov 1983 | Suspended |
Lizzee | Goodlow | Technical Services Librarian | 1 Nov 1961 | Suspended |
Kennedy | Haley | Senior Marketing Designer | 18 Dec 1960 | Active |
Chantal | Nailor | Technical Services Librarian | 10 Jan 1980 | Inactive |
Delma | Bonds | Lead Brand Manager | 21 Dec 1968 | Pending |
Roland | Salmos | Senior Program Developer | 5 Jun 1986 | Inactive |
Coy | Wollard | Customer Service Operator | 12 Oct 1982 | Active |
Maxwell | Maben | Regional Representative | 25 Feb 1988 | Suspended |
Cicely | Sigler | Senior Research Officer | 15 Mar 1960 | Pending |

##### DOM positioning

Each HTML control element presented by DataTables is denoted by a single character in the `dom` option. For example the `l` option is used for the `L`ength changing input option. In this example default DOM positions are mixed by adding correction classes to the parent container: `.length-left` to show length on the left side, `.filter-right` to show filter on the right etc.

First Name | Last Name | Job Title | DOB | Status | Actions
--- | --- | --- | --- | --- | ---
Marth | Enright | Traffic Court Referee | 22 Jun 1972 | Active |
Jackelyn | Weible | Airline Transport Pilot | 3 Oct 1981 | Inactive |
Aura | Hard | Business Services Sales Representative | 19 Apr 1969 | Suspended |
Nathalie | Pretty | Drywall Stripper | 13 Dec 1977 | Pending |
Sharan | Leland | Aviation Tactical Readiness Officer | 30 Dec 1991 | Inactive |
Maxine | Woldt | Business Services Sales Representative | 17 Oct 1987 | Pending |
Sylvia | Mcgaughy | Hemodialysis Technician | 11 Nov 1983 | Suspended |
Lizzee | Goodlow | Technical Services Librarian | 1 Nov 1961 | Suspended |
Kennedy | Haley | Senior Marketing Designer | 18 Dec 1960 | Active |
Chantal | Nailor | Technical Services Librarian | 10 Jan 1980 | Inactive |
Delma | Bonds | Lead Brand Manager | 21 Dec 1968 | Pending |
Roland | Salmos | Senior Program Developer | 5 Jun 1986 | Inactive |
Coy | Wollard | Customer Service Operator | 12 Oct 1982 | Active |
Maxwell | Maben | Regional Representative | 25 Feb 1988 | Suspended |
Cicely | Sigler | Senior Research Officer | 15 Mar 1960 | Pending |

##### Highlighting rows and columns

Highlighting rows and columns have be quite useful for drawing attention to where the user's cursor is in a table, particularly if you have a lot of narrow columns. Of course the highlighting of a row is easy enough using CSS, but for column highlighting, you need to use a little bit of Javascript. This example shows that in action on DataTable by making use of the `cell().index()`, `cells().nodes()` and `column().nodes()` methods.

First Name | Last Name | Job Title | DOB | Status | Actions
--- | --- | --- | --- | --- | ---
Marth | Enright | Traffic Court Referee | 22 Jun 1972 | Active |
Jackelyn | Weible | Airline Transport Pilot | 3 Oct 1981 | Inactive |
Aura | Hard | Business Services Sales Representative | 19 Apr 1969 | Suspended |
Nathalie | Pretty | Drywall Stripper | 13 Dec 1977 | Pending |
Sharan | Leland | Aviation Tactical Readiness Officer | 30 Dec 1991 | Inactive |
Maxine | Woldt | Business Services Sales Representative | 17 Oct 1987 | Pending |
Sylvia | Mcgaughy | Hemodialysis Technician | 11 Nov 1983 | Suspended |
Lizzee | Goodlow | Technical Services Librarian | 1 Nov 1961 | Suspended |
Kennedy | Haley | Senior Marketing Designer | 18 Dec 1960 | Active |
Chantal | Nailor | Technical Services Librarian | 10 Jan 1980 | Inactive |
Delma | Bonds | Lead Brand Manager | 21 Dec 1968 | Pending |
Roland | Salmos | Senior Program Developer | 5 Jun 1986 | Inactive |
Coy | Wollard | Customer Service Operator | 12 Oct 1982 | Active |
Maxwell | Maben | Regional Representative | 25 Feb 1988 | Suspended |
Cicely | Sigler | Senior Research Officer | 15 Mar 1960 | Pending |

##### Column rendering

Each column has an optional rendering control called `columns.render` which can be used to process the content of each cell before the data is used. This example shows the person's age `combined` with their name in the first column, hiding the age column. This technique can be useful for adding links, assigning colours based on content rules and any other form of text manipulation you require. Note: hidden column needs `.never` class to exclude it from the child row.

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