Configuration Option
The Responsive extension for DataTables can be applied to a DataTable in one of two ways; with a specific class name on the table, or using the DataTables initialisation options. This method shows the latter, with the responsive option being set to the boolean value true.
First name |
Last name |
About Employee |
Position |
Office |
Age |
Start date |
Salary |
Extn. |
E-mail |
Tiger |
Nixon |
In publishing and graphic design |
System Architect |
Edinburgh |
61 |
2011/04/25 |
$320,800 |
5421 |
john@example.com |
Garrett |
Winters |
In publishing and graphic design |
Accountant |
Tokyo |
63 |
2011/07/25 |
$170,750 |
8422 |
john@example.com |
Ashton |
Cox |
In publishing and graphic design |
Junior Technical Author |
San Francisco |
66 |
2009/01/12 |
$86,000 |
1562 |
john@example.com |
Cedric |
Kelly |
In publishing and graphic design |
Senior Javascript Developer |
Edinburgh |
22 |
2012/03/29 |
$433,060 |
6224 |
john@example.com |
Airi |
Satou |
In publishing and graphic design |
Accountant |
Tokyo |
33 |
2008/11/28 |
$162,700 |
5407 |
john@example.com |
Brielle |
Williamson |
In publishing and graphic design |
Integration Specialist |
New York |
61 |
2012/12/02 |
$372,000 |
4804 |
john@example.com |
Herrod |
Chandler |
In publishing and graphic design |
Sales Assistant |
San Francisco |
59 |
2012/08/06 |
$137,500 |
9608 |
john@example.com |
Rhona |
Davidson |
In publishing and graphic design |
Integration Specialist |
Tokyo |
55 |
2010/10/14 |
$327,900 |
6200 |
john@example.com |
Colleen |
Hurst |
In publishing and graphic design |
Javascript Developer |
San Francisco |
39 |
2009/09/15 |
$205,500 |
2360 |
john@example.com |
Sonya |
Frost |
In publishing and graphic design |
Software Engineer |
Edinburgh |
23 |
2008/12/13 |
$103,600 |
1667 |
john@example.com |
Jena |
Gaines |
In publishing and graphic design |
Office Manager |
London |
30 |
2008/12/19 |
$90,560 |
3814 |
john@example.com |
Quinn |
Flynn |
In publishing and graphic design |
Support Lead |
Edinburgh |
22 |
2013/03/03 |
$342,000 |
9497 |
john@example.com |
Charde |
Marshall |
In publishing and graphic design |
Regional Director |
San Francisco |
36 |
2008/10/16 |
$470,600 |
6741 |
john@example.com |
Haley |
Kennedy |
In publishing and graphic design |
Senior Marketing Designer |
London |
43 |
2012/12/18 |
$313,500 |
3597 |
john@example.com |
Tatyana |
Fitzpatrick |
In publishing and graphic design |
Regional Director |
London |
19 |
2010/03/17 |
$385,750 |
1965 |
john@example.com |
Michael |
Silva |
In publishing and graphic design |
Marketing Designer |
London |
66 |
2012/11/27 |
$198,500 |
1581 |
john@example.com |
Paul |
Byrd |
In publishing and graphic design |
Chief Financial Officer (CFO) |
New York |
64 |
2010/06/09 |
$725,000 |
3059 |
john@example.com |
Gloria |
Little |
In publishing and graphic design |
Systems Administrator |
New York |
59 |
2009/04/10 |
$237,500 |
1721 |
john@example.com |
Bradley |
Greer |
In publishing and graphic design |
Software Engineer |
London |
41 |
2012/10/13 |
$132,000 |
2558 |
john@example.com |
Dai |
Rios |
In publishing and graphic design |
Personnel Lead |
Edinburgh |
35 |
2012/09/26 |
$217,500 |
2290 |
john@example.com |
Jenette |
Caldwell |
In publishing and graphic design |
Development Lead |
New York |
30 |
2011/09/03 |
$345,000 |
1937 |
john@example.com |
Yuri |
Berry |
In publishing and graphic design |
Chief Marketing Officer (CMO) |
New York |
40 |
2009/06/25 |
$675,000 |
6154 |
john@example.com |
Caesar |
Vance |
In publishing and graphic design |
Pre-Sales Support |
New York |
21 |
2011/12/12 |
$106,450 |
8330 |
john@example.com |
Doris |
Wilder |
In publishing and graphic design |
Sales Assistant |
Sidney |
23 |
2010/09/20 |
$85,600 |
3023 |
john@example.com |
Angelica |
Ramos |
In publishing and graphic design |
Chief Executive Officer (CEO) |
London |
47 |
2009/10/09 |
$1,200,000 |
5797 |
john@example.com |
Gavin |
Joyce |
In publishing and graphic design |
Developer |
Edinburgh |
42 |
2010/12/22 |
$92,575 |
8822 |
john@example.com |
Jennifer |
Chang |
In publishing and graphic design |
Regional Director |
Singapore |
28 |
2010/11/14 |
$357,650 |
9239 |
john@example.com |
Brenden |
Wagner |
In publishing and graphic design |
Software Engineer |
San Francisco |
28 |
2011/06/07 |
$206,850 |
1314 |
john@example.com |
New Constructor
Responsive will automatically detect new DataTable instances being created on a page and initialize itself if it finds the responsive option or responsive class name on the table, as shown in the other examples.
First name |
Last name |
About Employee |
Position |
Office |
Age |
Start date |
Salary |
Extn. |
E-mail |
Tiger |
Nixon |
In publishing and graphic design |
System Architect |
Edinburgh |
61 |
2011/04/25 |
$320,800 |
5421 |
john@example.com |
Garrett |
Winters |
In publishing and graphic design |
Accountant |
Tokyo |
63 |
2011/07/25 |
$170,750 |
8422 |
john@example.com |
Ashton |
Cox |
In publishing and graphic design |
Junior Technical Author |
San Francisco |
66 |
2009/01/12 |
$86,000 |
1562 |
john@example.com |
Cedric |
Kelly |
In publishing and graphic design |
Senior Javascript Developer |
Edinburgh |
22 |
2012/03/29 |
$433,060 |
6224 |
john@example.com |
Airi |
Satou |
In publishing and graphic design |
Accountant |
Tokyo |
33 |
2008/11/28 |
$162,700 |
5407 |
john@example.com |
Brielle |
Williamson |
In publishing and graphic design |
Integration Specialist |
New York |
61 |
2012/12/02 |
$372,000 |
4804 |
john@example.com |
Herrod |
Chandler |
In publishing and graphic design |
Sales Assistant |
San Francisco |
59 |
2012/08/06 |
$137,500 |
9608 |
john@example.com |
Rhona |
Davidson |
In publishing and graphic design |
Integration Specialist |
Tokyo |
55 |
2010/10/14 |
$327,900 |
6200 |
john@example.com |
Colleen |
Hurst |
In publishing and graphic design |
Javascript Developer |
San Francisco |
39 |
2009/09/15 |
$205,500 |
2360 |
john@example.com |
Sonya |
Frost |
In publishing and graphic design |
Software Engineer |
Edinburgh |
23 |
2008/12/13 |
$103,600 |
1667 |
john@example.com |
Jena |
Gaines |
In publishing and graphic design |
Office Manager |
London |
30 |
2008/12/19 |
$90,560 |
3814 |
john@example.com |
Quinn |
Flynn |
In publishing and graphic design |
Support Lead |
Edinburgh |
22 |
2013/03/03 |
$342,000 |
9497 |
john@example.com |
Charde |
Marshall |
In publishing and graphic design |
Regional Director |
San Francisco |
36 |
2008/10/16 |
$470,600 |
6741 |
john@example.com |
Haley |
Kennedy |
In publishing and graphic design |
Senior Marketing Designer |
London |
43 |
2012/12/18 |
$313,500 |
3597 |
john@example.com |
Tatyana |
Fitzpatrick |
In publishing and graphic design |
Regional Director |
London |
19 |
2010/03/17 |
$385,750 |
1965 |
john@example.com |
Michael |
Silva |
In publishing and graphic design |
Marketing Designer |
London |
66 |
2012/11/27 |
$198,500 |
1581 |
john@example.com |
Paul |
Byrd |
In publishing and graphic design |
Chief Financial Officer (CFO) |
New York |
64 |
2010/06/09 |
$725,000 |
3059 |
john@example.com |
Gloria |
Little |
In publishing and graphic design |
Systems Administrator |
New York |
59 |
2009/04/10 |
$237,500 |
1721 |
john@example.com |
Bradley |
Greer |
In publishing and graphic design |
Software Engineer |
London |
41 |
2012/10/13 |
$132,000 |
2558 |
john@example.com |
Dai |
Rios |
In publishing and graphic design |
Personnel Lead |
Edinburgh |
35 |
2012/09/26 |
$217,500 |
2290 |
john@example.com |
Jenette |
Caldwell |
In publishing and graphic design |
Development Lead |
New York |
30 |
2011/09/03 |
$345,000 |
1937 |
john@example.com |
Yuri |
Berry |
In publishing and graphic design |
Chief Marketing Officer (CMO) |
New York |
40 |
2009/06/25 |
$675,000 |
6154 |
john@example.com |
Caesar |
Vance |
In publishing and graphic design |
Pre-Sales Support |
New York |
21 |
2011/12/12 |
$106,450 |
8330 |
john@example.com |
Doris |
Wilder |
In publishing and graphic design |
Sales Assistant |
Sidney |
23 |
2010/09/20 |
$85,600 |
3023 |
john@example.com |
Angelica |
Ramos |
In publishing and graphic design |
Chief Executive Officer (CEO) |
London |
47 |
2009/10/09 |
$1,200,000 |
5797 |
john@example.com |
Gavin |
Joyce |
In publishing and graphic design |
Developer |
Edinburgh |
42 |
2010/12/22 |
$92,575 |
8822 |
john@example.com |
Jennifer |
Chang |
In publishing and graphic design |
Regional Director |
Singapore |
28 |
2010/11/14 |
$357,650 |
9239 |
john@example.com |
Brenden |
Wagner |
In publishing and graphic design |
Software Engineer |
San Francisco |
28 |
2011/06/07 |
$206,850 |
1314 |
john@example.com |
Immediately Show Hidden Details
Responsive has the ability to display the details that it has hidden in a variety of different ways. Its default is to allow the end user to toggle the the display by clicking on a row and showing the information in a DataTables child row. At times it can be useful not to require end user interaction to display the hidden data in a responsive manner, which can be done with the childRowImmediate display type.
First name |
Last name |
About Employee |
Position |
Office |
Age |
Start date |
Salary |
Extn. |
E-mail |
Tiger |
Nixon |
In publishing and graphic design |
System Architect |
Edinburgh |
61 |
2011/04/25 |
$320,800 |
5421 |
john@example.com |
Garrett |
Winters |
In publishing and graphic design |
Accountant |
Tokyo |
63 |
2011/07/25 |
$170,750 |
8422 |
john@example.com |
Ashton |
Cox |
In publishing and graphic design |
Junior Technical Author |
San Francisco |
66 |
2009/01/12 |
$86,000 |
1562 |
john@example.com |
Cedric |
Kelly |
In publishing and graphic design |
Senior Javascript Developer |
Edinburgh |
22 |
2012/03/29 |
$433,060 |
6224 |
john@example.com |
Airi |
Satou |
In publishing and graphic design |
Accountant |
Tokyo |
33 |
2008/11/28 |
$162,700 |
5407 |
john@example.com |
Brielle |
Williamson |
In publishing and graphic design |
Integration Specialist |
New York |
61 |
2012/12/02 |
$372,000 |
4804 |
john@example.com |
Herrod |
Chandler |
In publishing and graphic design |
Sales Assistant |
San Francisco |
59 |
2012/08/06 |
$137,500 |
9608 |
john@example.com |
Rhona |
Davidson |
In publishing and graphic design |
Integration Specialist |
Tokyo |
55 |
2010/10/14 |
$327,900 |
6200 |
john@example.com |
Colleen |
Hurst |
In publishing and graphic design |
Javascript Developer |
San Francisco |
39 |
2009/09/15 |
$205,500 |
2360 |
john@example.com |
Sonya |
Frost |
In publishing and graphic design |
Software Engineer |
Edinburgh |
23 |
2008/12/13 |
$103,600 |
1667 |
john@example.com |
Jena |
Gaines |
In publishing and graphic design |
Office Manager |
London |
30 |
2008/12/19 |
$90,560 |
3814 |
john@example.com |
Quinn |
Flynn |
In publishing and graphic design |
Support Lead |
Edinburgh |
22 |
2013/03/03 |
$342,000 |
9497 |
john@example.com |
Charde |
Marshall |
In publishing and graphic design |
Regional Director |
San Francisco |
36 |
2008/10/16 |
$470,600 |
6741 |
john@example.com |
Haley |
Kennedy |
In publishing and graphic design |
Senior Marketing Designer |
London |
43 |
2012/12/18 |
$313,500 |
3597 |
john@example.com |
Tatyana |
Fitzpatrick |
In publishing and graphic design |
Regional Director |
London |
19 |
2010/03/17 |
$385,750 |
1965 |
john@example.com |
Michael |
Silva |
In publishing and graphic design |
Marketing Designer |
London |
66 |
2012/11/27 |
$198,500 |
1581 |
john@example.com |
Paul |
Byrd |
In publishing and graphic design |
Chief Financial Officer (CFO) |
New York |
64 |
2010/06/09 |
$725,000 |
3059 |
john@example.com |
Gloria |
Little |
In publishing and graphic design |
Systems Administrator |
New York |
59 |
2009/04/10 |
$237,500 |
1721 |
john@example.com |
Bradley |
Greer |
In publishing and graphic design |
Software Engineer |
London |
41 |
2012/10/13 |
$132,000 |
2558 |
john@example.com |
Dai |
Rios |
In publishing and graphic design |
Personnel Lead |
Edinburgh |
35 |
2012/09/26 |
$217,500 |
2290 |
john@example.com |
Jenette |
Caldwell |
In publishing and graphic design |
Development Lead |
New York |
30 |
2011/09/03 |
$345,000 |
1937 |
john@example.com |
Yuri |
Berry |
In publishing and graphic design |
Chief Marketing Officer (CMO) |
New York |
40 |
2009/06/25 |
$675,000 |
6154 |
john@example.com |
Caesar |
Vance |
In publishing and graphic design |
Pre-Sales Support |
New York |
21 |
2011/12/12 |
$106,450 |
8330 |
john@example.com |
Doris |
Wilder |
In publishing and graphic design |
Sales Assistant |
Sidney |
23 |
2010/09/20 |
$85,600 |
3023 |
john@example.com |
Angelica |
Ramos |
In publishing and graphic design |
Chief Executive Officer (CEO) |
London |
47 |
2009/10/09 |
$1,200,000 |
5797 |
john@example.com |
Gavin |
Joyce |
In publishing and graphic design |
Developer |
Edinburgh |
42 |
2010/12/22 |
$92,575 |
8822 |
john@example.com |
Jennifer |
Chang |
In publishing and graphic design |
Regional Director |
Singapore |
28 |
2010/11/14 |
$357,650 |
9239 |
john@example.com |
Brenden |
Wagner |
In publishing and graphic design |
Software Engineer |
San Francisco |
28 |
2011/06/07 |
$206,850 |
1314 |
john@example.com |