columns.render has a wide array of options available to it for
- rendering different types of data orthogonally (sorting, filtering, display etc), but it can be used
+ rendering different types of data orthogonally (ordering, searching, display etc), but it can be used
very simply to manipulate the content of a cell, as shown here.
This example shows the person's age combined with their name in the first column, hiding the age @@ -624,8 +624,8 @@ $(document).ready(function() {
Note that each column must have at least one unique cell (i.e. a cell without colspan) so DataTables - can use that cell to detect the column and use it to apply sorting.
+ can use that cell to detect the column and use it to apply ordering.The example below shows a header spanning multiple cells over the contact information, with one of the columns that the span covers being hidden.
@@ -618,8 +618,8 @@ $(document).ready(function() {This example shows the filtering and sorting features of DataTables being disabled by default, which - is reflected in the table when it is initialised.
+This example shows the searching and ordering features of DataTables being disabled by default, + which is reflected in the table when it is initialised.
| Name | @@ -635,8 +635,8 @@ td.highlight {
|---|
| Name | -Position | -Office | -Age | -Start date | -Salary | -
|---|---|---|---|---|---|
| Name | -Position | -Office | -Age | -Start date | -Salary | -
| Tiger Nixon | -System Architect | -Edinburgh | -61 | -2011/04/25 | -$3,120 | -
| Garrett Winters | -Director | -Edinburgh | -63 | -2011/07/25 | -$5,300 | -
| Ashton Cox | -Technical Author | -San Francisco | -66 | -2009/01/12 | -$4,800 | -
| Cedric Kelly | -Javascript Developer | -Edinburgh | -22 | -2012/03/29 | -$3,600 | -
| Jenna Elliott | -Financial Controller | -Edinburgh | -33 | -2008/11/28 | -$5,300 | -
| Brielle Williamson | -Integration Specialist | -New York | -61 | -2012/12/02 | -$4,525 | -
| Herrod Chandler | -Sales Assistant | -San Francisco | -59 | -2012/08/06 | -$4,080 | -
| Rhona Davidson | -Integration Specialist | -Edinburgh | -55 | -2010/10/14 | -$6,730 | -
| Colleen Hurst | -Javascript Developer | -San Francisco | -39 | -2009/09/15 | -$5,000 | -
| Sonya Frost | -Software Engineer | -Edinburgh | -23 | -2008/12/13 | -$3,600 | -
| Jena Gaines | -System Architect | -London | -30 | -2008/12/19 | -$5,000 | -
| Quinn Flynn | -Financial Controller | -Edinburgh | -22 | -2013/03/03 | -$4,200 | -
| Charde Marshall | -Regional Director | -San Francisco | -36 | -2008/10/16 | -$5,300 | -
| Haley Kennedy | -Senior Marketing Designer | -London | -43 | -2012/12/18 | -$4,800 | -
| Tatyana Fitzpatrick | -Regional Director | -London | -19 | -2010/03/17 | -$2,875 | -
| Michael Silva | -Senior Marketing Designer | -London | -66 | -2012/11/27 | -$3,750 | -
| Paul Byrd | -Javascript Developer | -New York | -64 | -2010/06/09 | -$5,000 | -
| Gloria Little | -Systems Administrator | -New York | -59 | -2009/04/10 | -$3,120 | -
| Bradley Greer | -Software Engineer | -London | -41 | -2012/10/13 | -$3,120 | -
| Dai Rios | -System Architect | -Edinburgh | -35 | -2012/09/26 | -$4,200 | -
| Jenette Caldwell | -Financial Controller | -New York | -30 | -2011/09/03 | -$4,965 | -
| Yuri Berry | -System Architect | -New York | -40 | -2009/06/25 | -$3,600 | -
| Caesar Vance | -Technical Author | -New York | -21 | -2011/12/12 | -$4,965 | -
| Doris Wilder | -Sales Assistant | -Edinburgh | -23 | -2010/09/20 | -$4,965 | -
| Angelica Ramos | -System Architect | -London | -36 | -2009/10/09 | -$2,875 | -
| Gavin Joyce | -Developer | -Edinburgh | -42 | -2010/12/22 | -$4,525 | -
| Jennifer Chang | -Regional Director | -London | -28 | -2010/11/14 | -$4,080 | -
| Brenden Wagner | -Software Engineer | -San Francisco | -18 | -2011/06/07 | -$3,750 | -
| Ebony Grimes | -Software Engineer | -San Francisco | -48 | -2010/03/11 | -$2,875 | -
| Russell Chavez | -Director | -Edinburgh | -20 | -2011/08/14 | -$3,600 | -
| Michelle House | -Integration Specialist | -Edinburgh | -37 | -2011/06/02 | -$3,750 | -
| Suki Burks | -Developer | -London | -53 | -2009/10/22 | -$2,875 | -
| Prescott Bartlett | -Technical Author | -London | -27 | -2011/05/07 | -$6,730 | -
| Gavin Cortez | -Technical Author | -San Francisco | -22 | -2008/10/26 | -$6,730 | -
| Martena Mccray | -Integration Specialist | -Edinburgh | -46 | -2011/03/09 | -$4,080 | -
| Unity Butler | -Senior Marketing Designer | -San Francisco | -47 | -2009/12/09 | -$3,750 | -
| Howard Hatfield | -Financial Controller | -San Francisco | -51 | -2008/12/16 | -$4,080 | -
| Hope Fuentes | -Financial Controller | -San Francisco | -41 | -2010/02/12 | -$4,200 | -
| Vivian Harrell | -System Architect | -San Francisco | -62 | -2009/02/14 | -$4,965 | -
| Timothy Mooney | -Financial Controller | -London | -37 | -2008/12/11 | -$4,200 | -
| Jackson Bradshaw | -Director | -New York | -65 | -2008/09/26 | -$5,000 | -
| Miriam Weiss | -Support Engineer | -Edinburgh | -64 | -2011/02/03 | -$4,965 | -
| Bruno Nash | -Software Engineer | -London | -38 | -2011/05/03 | -$4,200 | -
| Odessa Jackson | -Support Engineer | -Edinburgh | -37 | -2009/08/19 | -$3,600 | -
| Thor Walton | -Developer | -New York | -61 | -2013/08/11 | -$3,600 | -
| Finn Camacho | -Support Engineer | -San Francisco | -47 | -2009/07/07 | -$4,800 | -
| Elton Baldwin | -Data Coordinator | -Edinburgh | -64 | -2012/04/09 | -$6,730 | -
| Zenaida Frank | -Software Engineer | -New York | -63 | -2010/01/04 | -$4,800 | -
| Zorita Serrano | -Software Engineer | -San Francisco | -56 | -2012/06/01 | -$5,300 | -
| Jennifer Acosta | -Javascript Developer | -Edinburgh | -43 | -2013/02/01 | -$2,875 | -
| Cara Stevens | -Sales Assistant | -New York | -46 | -2011/12/06 | -$4,800 | -
| Hermione Butler | -Director | -London | -47 | -2011/03/21 | -$4,080 | -
| Lael Greer | -Systems Administrator | -London | -21 | -2009/02/27 | -$3,120 | -
| Jonas Alexander | -Developer | -San Francisco | -30 | -2010/07/14 | -$5,300 | -
| Shad Decker | -Regional Director | -Edinburgh | -51 | -2008/11/13 | -$5,300 | -
| Michael Bruce | -Javascript Developer | -Edinburgh | -29 | -2011/06/27 | -$4,080 | -
| Donna Snider | -System Architect | -New York | -27 | -2011/01/25 | -$3,120 | -
The Javascript shown below is used to initialise the table shown in this example:
-
-$(document).ready(function() {
- $('#example').dataTable();
-} );
-
-
- In addition to the above code, the following Javascript library files are loaded for use in this - example:
- - -The HTML shown below is the raw HTML table element, before it has been enhanced by - DataTables:
-This example uses a little bit of additional CSS beyond what is loaded from the library - files (below), in order to correctly display the table. The additional CSS used is shown - below:
-- --
The following CSS library files are loaded for use in this example to provide the styling of the - table:
- - -This table loads data by Ajax. The latest data that has been loaded is shown below. This data - will update automatically as any additional data is loaded.
-