在Datatable中单击选择行并将所选数据导出为Excel [英] Select Row in Single Click in Datatable and Export Selected Data as Excel
本文介绍了在Datatable中单击选择行并将所选数据导出为Excel的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在使用数据表向其中填充数据。要求是要导出这些数据。用户可以一次导出选定的行或全部数据。我已经使用了数据表导出Excel功能，该功能创建按钮两个导出全部按钮和导出选择，导出数据。导出所有工作正常，但是当我使用datatable的功能来选择使用select：true的行时，我必须使用CTRL按钮来选择多行，并且它工作正常并导出数据，但我不希望这，所以我在table.tr上创建了一个click事件，它将选中的类添加到TR中，TR选择该行，但是在选择该行后，当我导出数据时，没有任何导出，则该excel为空。可能是什么问题，select：true会将选中的类添加到TR中，并且我还将添加的类添加到TR上，但是为什么数据不会导出，任何人都可以对此有所了解。我也创建了一个小提琴：数据表演小提琴
我的代码如下：
< table id =examplecellspacing =0width =100％class =display row-border nowrap table-striped responsive-utilities jambo_table>
< thead>
< th>名称< / th>
< th>公司< / th>
办公室电话< / th>
< th>国家< / th>
< th>动作< / th>
< / thead>
< tbody>
< tr>
< td> Test 1< / td>
< td class =dt-center> 1< / td>
< td class =dt-center> 1< / td>
< td class =dt-center>英国< / td>
< td class =dt-center not-exported>编辑按钮< / td>
< / tr>
< tr>
< td>测试2< / td>
< td class =dt-center> 2< / td>
< td class =dt-center> 2< / td>
< td class =dt-center>英国< / td>
< td class =dt-center not-exported>编辑按钮< / td>
< / tr>
< tr>
< td> Test 3< / td>
< td class =dt-center> 3< / td>
< td class =dt-center> 3< / td>
< td class =dt-center>英国< / td>
< td class =dt-center not-exported>编辑按钮< / td>
< / tr>
< / tbody>
< / table>
< script type =text / javascript>
$（document）.ready（function（）{
$（'＃example'）。DataTable（{
lengthMenu：[5，10，50，100]，
pageLength：20，
scrollX：true，
dom：'Bfrtip'，
按钮：[
{
extend：'excelHtml5'，
text：'全部导出'，
exportOptions：{
列：'：visible：not（.not-exported）'
}
}，
{
extend：'excelHtml5'，
text：'Export selected'，
exportOptions：{
列：'：visible：not（.not-exported）'，
modifier：{
selected：true
}
}
}，
'colvis'
]，
// select：真
}）;
$（'＃example tbody'）。on（'click'，'tr'，function（）{
$（this）.toggleClass（'selected'）;
}）;
}）;
< / script>
解决方案
试试看：
HTML：
< script src =https：// ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js\"></script>
< link href =https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css =stylesheettype =text / css/>
< script src ='https：//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js'>< / script>
< script src ='https：//cdn.datatables.net/buttons/1.2.1/js/dataTables.buttons.min.js'>< / script>
< script src ='// cdn.datatables.net/buttons/1.2.1/js/buttons.flash.min.js'></script>
< script src ='// cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js'></script>
< script src ='// cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js'></script>
< script src ='// cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js'></script>
< script src ='// cdn.datatables.net/buttons/1.2.1/js/buttons.html5.min.js'></script>
< script src ='// cdn.datatables.net/buttons/1.2.1/js/buttons.print.min.js'></script>
< script src ='https：//cdn.datatables.net/select/1.2.0/js/dataTables.select.min.js'>< / script>
< table id =exampleclass =display nowrapcellspacing =0width =100％>
< thead>
< tr>
< th>名称< / th>
< th>位置< / th>
< th> Office< / th>
< th>年龄< / th>
< th>开始日期< / th>
工资< / th>
< / tr>
< / thead>
< tfoot>
< tr>
< th>名称< / th>
< th>位置< / th>
< th> Office< / th>
< th>年龄< / th>
< th>开始日期< / th>
工资< / th>
< / tr>
< / tfoot>
< tbody>
< tr>
< td>泰克尼克森< / td>
< td>系统架构师< / td>
< td>爱丁堡< / td>
< td> 61< / td>
< td> 2011/04/25< / td>
< td> $ 320,800< / td>
< / tr>
< tr>
< td>加勒特温特斯< / td>
< td>会计师< / td>
< td>东京< / td>
< td> 63< / td>
< td> 2011/07/25< / td>
< td> $ 170,750< / td>
< / tr>
< tr>
< td> Ashton Cox< / td>
< td> Junior Technical Author< / td>
< td>旧金山< / td>
< td> 66< / td>
< td> 2009/01/12< / td>
< td> $ 86,000< / td>
< / tr>
< tr>
< td>塞德里克凯利< / td>
< td>高级Javascript开发人员< / td>
< td>爱丁堡< / td>
< td> 22< / td>
< td> 2012/03/29< / td>
< td> $ 433,060< / td>
< / tr>
< tr>
< td> Airi Satou< / td>
< td>会计师< / td>
< td>东京< / td>
< td> 33< / td>
< td> 2008/11/28< / td>
< td> $ 162,700< / td>
< / tr>
< tr>
< td> Brielle Williamson< / td>
< td>整合专家< / td>
< td>纽约< / td>
< td> 61< / td>
< td> 2012/12/02< / td>
< td> $ 372,000< / td>
< / tr>
< tr>
< td> Herrod Chandler< / td>
< td>销售助理< / td>
< td>旧金山< / td>
< td> 59< / td>
< td> 2012/08/06< / td>
< td> $ 137,500< / td>
< / tr>
< tr>
< td> Rhona Davidson< / td>
< td>整合专家< / td>
< td>东京< / td>
< td> 55< / td>
< td> 2010/10/14< / td>
< td> $ 327,900< / td>
< / tr>
< tr>
< td> Colleen Hurst< / td>
< td> Javascript开发人员< / td>
< td>旧金山< / td>
< td> 39< / td>
< td> 2009/09/15< / td>
< td> $ 205,500< / td>
< / tr>
< tr>
< td> Sonya Frost< / td>
< td>软件工程师< / td>
< td>爱丁堡< / td>
< td> 23< / td>
< td> 2008/12/13< / td>
< td> $ 103,600< / td>
< / tr>
< tr>
< td> Jena Gaines< / td>
< td> Office Manager< / td>
< td>伦敦< / td>
< td> 30< / td>
< td> 2008/12/19< / td>
< td> $ 90,560< / td>
< / tr>
< tr>
< td> Quinn Flynn< / td>
< td>支持潜在客户< / td>
< td>爱丁堡< / td>
< td> 22< / td>
< td> 2013/03/03< / td>
< td> $ 342,000< / td>
< / tr>
< tr>
< td> Charde Marshall< / td>
< td>区域总监< / td>
< td>旧金山< / td>
< td> 36< / td>
< td> 2008/10/16< / td>
< td> $ 470,600< / td>
< / tr>
< tr>
< td>海利肯尼迪< / td>
< td>高级营销设计师< / td>
< td>伦敦< / td>
< td> 43< / td>
< td> 2012/12/18< / td>
< td> $ 313,500< / td>
< / tr>
< tr>
< td> Tatyana Fitzpatrick< / td>
< td>区域总监< / td>
< td>伦敦< / td>
< td> 19< / td>
< td> 2010/03/17< / td>
< td> $ 385,750< / td>
< / tr>
< tr>
< td>迈克尔席尔瓦< / td>
< td>营销设计师< / td>
< td>伦敦< / td>
< td> 66< / td>
< td> 2012/11/27< / td>
< td> $ 198,500< / td>
< / tr>
< tr>
< td> Paul Byrd< / td>
< td>首席财务官（CFO）< / td>
< td>纽约< / td>
< td> 64< / td>
< td> 2010/06/09< / td>
< td> $ 725,000< / td>
< / tr>
< tr>
< td> Gloria Little< / td>
< td>系统管理员< / td>
< td>纽约< / td>
< td> 59< / td>
< td> 2009/04/10< / td>
< td> $ 237,500< / td>
< / tr>
< tr>
< td>布拉德利格里尔< / td>
< td>软件工程师< / td>
< td>伦敦< / td>
< td> 41< / td>
< td> 2012/10/13< / td>
< td> $ 132,000< / td>
< / tr>
< tr>
< td> Dai Rios< / td>
< td>人事主管< / td>
< td>爱丁堡< / td>
< td> 35< / td>
< td> 2012/09/26< / td>
< td> $ 217,500< / td>
< / tr>
< tr>
< td> Jenette Caldwell< / td>
< td>开发主管< / td>
< td>纽约< / td>
< td> 30< / td>
< td> 2011/09/03< / td>
< td> $ 345,000< / td>
< / tr>
< tr>
< td> Yuri Berry< / td>
< td>首席营销官（CMO）< / td>
< td>纽约< / td>
< td> 40< / td>
< td> 2009/06/25< / td>
< td> $ 675,000< / td>
< / tr>
< tr>
< td>凯撒万斯< / td>
< td>售前支持< / td>
< td>纽约< / td>
< td> 21< / td>
< td> 2011/12/12< / td>
< td> $ 106,450< / td>
< / tr>
< tr>
< td> Doris Wilder< / td>
< td>销售助理< / td>
< td> Sidney< / td>
< td> 23< / td>
< td> 2010/09/20< / td>
< td> $ 85,600< / td>
< / tr>
< tr>
< td> Angelica Ramos< / td>
< td>首席执行官（CEO）< / td>
< td>伦敦< / td>
< td> 47< / td>
< td> 2009/10/09< / td>
< td> $ 1,200,000< / td>
< / tr>
< tr>
< td> Gavin Joyce< / td>
< td>开发人员< / td>
< td>爱丁堡< / td>
< td> 42< / td>
< td> 2010/12/22< / td>
< td> $ 92,575< / td>
< / tr>
< tr>
< td> Jennifer Chang< / td>
< td>区域总监< / td>
< td>新加坡< / td>
< td> 28< / td>
< td> 2010/11/14< / td>
< td> $ 357,650< / td>
< / tr>
< tr>
< td> Brenden Wagner< / td>
< td>软件工程师< / td>
< td>旧金山< / td>
< td> 28< / td>
< td> 2011/06/07< / td>
< td> $ 206,850< / td>
< / tr>
< tr>
< td> Fiona Green< / td>
< td>首席营运官（COO）< / td>
< td>旧金山< / td>
< td> 48< / td>
< td> 2010/03/11< / td>
< td> 850,000美元< / td>
< / tr>
< tr>
< td> Shou Itou< / td>
< td>区域营销< / td>
< td>东京< / td>
< td> 20< / td>
< td> 2011/08/14< / td>
< td> $ 163,000< / td>
< / tr>
< tr>
< td> Michelle House< / td>
< td>整合专家< / td>
< td> Sidney< / td>
< td> 37< / td>
< td> 2011/06/02< / td>
< td> $ 95,400< / td>
< / tr>
< tr>
< td> Suki Burks< / td>
< td>开发人员< / td>
< td>伦敦< / td>
< td> 53< / td>
< td> 2009/10/22< / td>
< td> $ 114,500< / td>
< / tr>
< tr>
< td>普雷斯科特巴特利特< / td>
< td>技术作者< / td>
< td>伦敦< / td>
< td> 27< / td>
< td> 2011/05/07< / td>
< td> 145,000美元< / td>
< / tr>
< tr>
< td> Gavin Cortez< / td>
< td>团队负责人< / td>
< td>旧金山< / td>
< td> 22< / td>
< td> 2008/10/26< / td>
< td> $ 235,500< / td>
< / tr>
< tr>
< td> Martena Mccray< / td>
< td>售后支持< / td>
< td>爱丁堡< / td>
< td> 46< / td>
< td> 2011/03/09< / td>
< td> $ 324,050< / td>
< / tr>
< tr>
< td> Unity Butler< / td>
< td>营销设计师< / td>
< td>旧金山< / td>
< td> 47< / td>
< td> 2009/12/09< / td>
< td> $ 85,675< / td>
< / tr>
< tr>
< td> Howard Hatfield< / td>
< td> Office Manager< / td>
< td>旧金山< / td>
< td> 51< / td>
< td> 2008/12/16< / td>
< td> $ 164,500< / td>
< / tr>
< tr>
< td> Hope Fuentes< / td>
< td>秘书< / td>
< td>旧金山< / td>
< td> 41< / td>
< td> 2010/02/12< / td>
< td> $ 109,850< / td>
< / tr>
< tr>
< td> Vivian Harrell< / td>
< td>财务总监< / td>
< td>旧金山< / td>
< td> 62< / td>
< td> 2009/02/14< / td>
< td> $ 452,500< / td>
< / tr>
< tr>
< td> Timothy Mooney< / td>
< td> Office Manager< / td>
< td>伦敦< / td>
< td> 37< / td>
< td> 2008/12/11< / td>
< td> $ 136,200< / td>
< / tr>
< tr>
< td>杰克逊布拉德肖< / td>
< td>导演< / td>
< td>纽约< / td>
< td> 65< / td>
< td> 2008/09/26< / td>
< td> $ 645,750< / td>
< / tr>
< tr>
< td> Olivia Liang< / td>
< td>支援工程师< / td>
< td>新加坡< / td>
< td> 64< / td>
< td> 2011/02/03< / td>
< td> $ 234,500< / td>
< / tr>
< tr>
< td> Bruno Nash< / td>
< td>软件工程师< / td>
< td>伦敦< / td>
< td> 38< / td>
< td> 2011/05/03< / td>
< td> $ 163,500< / td>
< / tr>
< tr>
< td> Sakura Yamamoto< / td>
< td>支援工程师< / td>
< td>东京< / td>
< td> 37< / td>
< td> 2009/08/19< / td>
< td> $ 139,575< / td>
< / tr>
< tr>
< td> Thor Walton< / td>
< td>开发人员< / td>
< td>纽约< / td>
< td> 61< / td>
< td> 2013/08/11< / td>
< td> $ 98,540< / td>
< / tr>
< tr>
< td> Finn Camacho< / td>
< td>支援工程师< / td>
< td>旧金山< / td>
< td> 47< / td>
< td> 2009/07/07< / td>
< td> $ 87,500< / td>
< / tr>
< tr>
< td> Serge Baldwin< / td>
< td>数据协调员< / td>
< td>新加坡< / td>
< td> 64< / td>
< td> 2012/04/09< / td>
< td> $ 138,575< / td>
< / tr>
< tr>
< td> Zenaida Frank< / td>
< td>软件工程师< / td>
< td>纽约< / td>
< td> 63< / td>
< td> 2010/01/04< / td>
< td> $ 125,250< / td>
< / tr>
< tr>
< td> Zorita Serrano< / td>
< td>软件工程师< / td>
< td>旧金山< / td>
< td> 56< / td>
< td> 2012/06/01< / td>
< td> $ 115,000< / td>
< / tr>
< tr>
< td> Jennifer Acosta< / td>
< td> Junior Junior Developer< / td>
< td>爱丁堡< / td>
< td> 43< / td>
< td> 2013/02/01< / td>
< td> $ 75,650< / td>
< / tr>
< tr>
< td> Cara Stevens< / td>
< td>销售助理< / td>
< td>纽约< / td>
< td> 46< / td>
< td> 2011/12/06< / td>
< td> $ 145,600< / td>
< / tr>
< tr>
< td>赫敏巴特勒< / td>
< td>区域总监< / td>
< td>伦敦< / td>
< td> 47< / td>
< td> 2011/03/21< / td>
< td> $ 356,250< / td>
< / tr>
< tr>
< td> Lael Greer< / td>
< td>系统管理员< / td>
< td>伦敦< / td>
< td> 21< / td>
< td> 2009/02/27< / td>
< td> $ 103,500< / td>
< / tr>
< tr>
< td>乔纳斯亚历山大< / td>
< td>开发人员< / td>
< td>旧金山< / td>
< td> 30< / td>
< td> 2010/07/14< / td>
< td> $ 86,500< / td>
< / tr>
< tr>
< td> Shad Decker< / td>
< td>区域总监< / td>
< td>爱丁堡< / td>
< td> 51< / td>
< td> 2008/11/13< / td>
< td> $ 183,000< / td>
< / tr>
< tr>
< td>迈克尔布鲁斯< / td>
< td> Javascript开发人员< / td>
< td>新加坡< / td>
< td> 29< / td>
< td> 2011/06/27< / td>
< td> $ 183,000< / td>
< / tr>
< tr>
< td> Donna Snider< / td>
< td>客户支持< / td>
< td>纽约< / td>
< td> 27< / td>
< td> 2011/01/25< / td>
< td> $ 112,000< / td>
< / tr>
< / tbody>
< / table>
Javascript：
$（document）.ready（function（）{
var table = $（'＃example'）。DataTable（{
lengthMenu：[ 5，10，50，100]，
pageLength：50，
scrollX：true，
dom：'Bfrtip'，
按钮：[{
扩展：'excelHtml5'，
text：'全部导出'，
exportOptions：{
列：'：visible：not（.not-exported）'
}，
标题：'数据导出'
}，{
扩展：'excelHtml5'，
文本：'导出选择'，
exportOptions：{
列： '：visible：not（.not-exported）'，
modifier：{
selected：true
}
}，
title：'Data ex端口'
}
]，
选择：{
style：'multi'
}
}）;
}）;
jsfiddle：
https://jsfiddle.net/p8cymj4s/2/
I am using a datatable to populate data into it. The requirement is that this data is to be exported. The User can export "Selected Rows" or "All" the Data at once. I have used the datatable export Excel functionality which creates buttons two buttons "Export All" and "Export Selected" which exports the data. Export All works fine but when I use the functionality of datatable to select rows using "select:true", I have to use the CTRL Button to select multiple rows, and it works fine and exports data as well but I don't want this, so I created a click event on the table.tr which adds the selected class to TR, which selects the row, but after selecting the row, when I export the data, nothing export's, the excel is blank. What may be the issue, "select:true" adds class selected to the TR and I am also adding class selected to the TR on click but why the data is not exporting, can anyone has idea about this. I have also created a fiddle: Datatable Fiddle My code is as:
<table id="example" cellspacing="0" width="100%" class="display row-border nowrap table-striped responsive-utilities jambo_table">
<thead>
<th>Name</th>
<th>Company</th>
<th>Office Phone</th>
<th>Country</th>
<th>Action</th>
</thead>
<tbody>
<tr>
<td>Test 1</td>
<td class="dt-center">1</td>
<td class="dt-center">1</td>
<td class="dt-center">United Kingdom</td>
<td class="dt-center not-exported">Edit Button</td>
</tr>
<tr>
<td>Test 2</td>
<td class="dt-center">2</td>
<td class="dt-center">2</td>
<td class="dt-center">United Kingdom</td>
<td class="dt-center not-exported">Edit Button</td>
</tr>
<tr>
<td>Test 3</td>
<td class="dt-center">3</td>
<td class="dt-center">3</td>
<td class="dt-center">United Kingdom</td>
<td class="dt-center not-exported">Edit Button</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
$(document).ready(function() {
$('#example').DataTable({
"lengthMenu": [5, 10, 50, 100],
"pageLength": 20,
"scrollX": true,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
text: 'Export All',
exportOptions: {
columns: ':visible:not(.not-exported)'
}
},
{
extend: 'excelHtml5',
text: 'Export selected',
exportOptions: {
columns: ':visible:not(.not-exported)',
modifier: {
selected: true
}
}
},
'colvis'
],
// select: true
});
$('#example tbody').on('click', 'tr', function () {
$(this).toggleClass('selected');
});
});
</script>
解决方案
Try it:
HTML:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css"/>
<script src='https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js'></script>
<script src='https://cdn.datatables.net/buttons/1.2.1/js/dataTables.buttons.min.js'></script>
<script src='//cdn.datatables.net/buttons/1.2.1/js/buttons.flash.min.js'></script>
<script src='//cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js'></script>
<script src='//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js'></script>
<script src='//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js'></script>
<script src='//cdn.datatables.net/buttons/1.2.1/js/buttons.html5.min.js'></script>
<script src='//cdn.datatables.net/buttons/1.2.1/js/buttons.print.min.js'></script>
<script src='https://cdn.datatables.net/select/1.2.0/js/dataTables.select.min.js'></script>
<table id="example" class="display nowrap" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>63</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>66</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>22</td>
<td>2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>Airi Satou</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>33</td>
<td>2008/11/28</td>
<td>$162,700</td>
</tr>
<tr>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>61</td>
<td>2012/12/02</td>
<td>$372,000</td>
</tr>
<tr>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>59</td>
<td>2012/08/06</td>
<td>$137,500</td>
</tr>
<tr>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>55</td>
<td>2010/10/14</td>
<td>$327,900</td>
</tr>
<tr>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>39</td>
<td>2009/09/15</td>
<td>$205,500</td>
</tr>
<tr>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>23</td>
<td>2008/12/13</td>
<td>$103,600</td>
</tr>
<tr>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>30</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>22</td>
<td>2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>36</td>
<td>2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>43</td>
<td>2012/12/18</td>
<td>$313,500</td>
</tr>
<tr>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>19</td>
<td>2010/03/17</td>
<td>$385,750</td>
</tr>
<tr>
<td>Michael Silva</td>
<td>Marketing Designer</td>
<td>London</td>
<td>66</td>
<td>2012/11/27</td>
<td>$198,500</td>
</tr>
<tr>
<td>Paul Byrd</td>
<td>Chief Financial Officer (CFO)</td>
<td>New York</td>
<td>64</td>
<td>2010/06/09</td>
<td>$725,000</td>
</tr>
<tr>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>59</td>
<td>2009/04/10</td>
<td>$237,500</td>
</tr>
<tr>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>41</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>35</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>30</td>
<td>2011/09/03</td>
<td>$345,000</td>
</tr>
<tr>
<td>Yuri Berry</td>
<td>Chief Marketing Officer (CMO)</td>
<td>New York</td>
<td>40</td>
<td>2009/06/25</td>
<td>$675,000</td>
</tr>
<tr>
<td>Caesar Vance</td>
<td>Pre-Sales Support</td>
<td>New York</td>
<td>21</td>
<td>2011/12/12</td>
<td>$106,450</td>
</tr>
<tr>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Sidney</td>
<td>23</td>
<td>2010/09/20</td>
<td>$85,600</td>
</tr>
<tr>
<td>Angelica Ramos</td>
<td>Chief Executive Officer (CEO)</td>
<td>London</td>
<td>47</td>
<td>2009/10/09</td>
<td>$1,200,000</td>
</tr>
<tr>
<td>Gavin Joyce</td>
<td>Developer</td>
<td>Edinburgh</td>
<td>42</td>
<td>2010/12/22</td>
<td>$92,575</td>
</tr>
<tr>
<td>Jennifer Chang</td>
<td>Regional Director</td>
<td>Singapore</td>
<td>28</td>
<td>2010/11/14</td>
<td>$357,650</td>
</tr>
<tr>
<td>Brenden Wagner</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>28</td>
<td>2011/06/07</td>
<td>$206,850</td>
</tr>
<tr>
<td>Fiona Green</td>
<td>Chief Operating Officer (COO)</td>
<td>San Francisco</td>
<td>48</td>
<td>2010/03/11</td>
<td>$850,000</td>
</tr>
<tr>
<td>Shou Itou</td>
<td>Regional Marketing</td>
<td>Tokyo</td>
<td>20</td>
<td>2011/08/14</td>
<td>$163,000</td>
</tr>
<tr>
<td>Michelle House</td>
<td>Integration Specialist</td>
<td>Sidney</td>
<td>37</td>
<td>2011/06/02</td>
<td>$95,400</td>
</tr>
<tr>
<td>Suki Burks</td>
<td>Developer</td>
<td>London</td>
<td>53</td>
<td>2009/10/22</td>
<td>$114,500</td>
</tr>
<tr>
<td>Prescott Bartlett</td>
<td>Technical Author</td>
<td>London</td>
<td>27</td>
<td>2011/05/07</td>
<td>$145,000</td>
</tr>
<tr>
<td>Gavin Cortez</td>
<td>Team Leader</td>
<td>San Francisco</td>
<td>22</td>
<td>2008/10/26</td>
<td>$235,500</td>
</tr>
<tr>
<td>Martena Mccray</td>
<td>Post-Sales support</td>
<td>Edinburgh</td>
<td>46</td>
<td>2011/03/09</td>
<td>$324,050</td>
</tr>
<tr>
<td>Unity Butler</td>
<td>Marketing Designer</td>
<td>San Francisco</td>
<td>47</td>
<td>2009/12/09</td>
<td>$85,675</td>
</tr>
<tr>
<td>Howard Hatfield</td>
<td>Office Manager</td>
<td>San Francisco</td>
<td>51</td>
<td>2008/12/16</td>
<td>$164,500</td>
</tr>
<tr>
<td>Hope Fuentes</td>
<td>Secretary</td>
<td>San Francisco</td>
<td>41</td>
<td>2010/02/12</td>
<td>$109,850</td>
</tr>
<tr>
<td>Vivian Harrell</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>62</td>
<td>2009/02/14</td>
<td>$452,500</td>
</tr>
<tr>
<td>Timothy Mooney</td>
<td>Office Manager</td>
<td>London</td>
<td>37</td>
<td>2008/12/11</td>
<td>$136,200</td>
</tr>
<tr>
<td>Jackson Bradshaw</td>
<td>Director</td>
<td>New York</td>
<td>65</td>
<td>2008/09/26</td>
<td>$645,750</td>
</tr>
<tr>
<td>Olivia Liang</td>
<td>Support Engineer</td>
<td>Singapore</td>
<td>64</td>
<td>2011/02/03</td>
<td>$234,500</td>
</tr>
<tr>
<td>Bruno Nash</td>
<td>Software Engineer</td>
<td>London</td>
<td>38</td>
<td>2011/05/03</td>
<td>$163,500</td>
</tr>
<tr>
<td>Sakura Yamamoto</td>
<td>Support Engineer</td>
<td>Tokyo</td>
<td>37</td>
<td>2009/08/19</td>
<td>$139,575</td>
</tr>
<tr>
<td>Thor Walton</td>
<td>Developer</td>
<td>New York</td>
<td>61</td>
<td>2013/08/11</td>
<td>$98,540</td>
</tr>
<tr>
<td>Finn Camacho</td>
<td>Support Engineer</td>
<td>San Francisco</td>
<td>47</td>
<td>2009/07/07</td>
<td>$87,500</td>
</tr>
<tr>
<td>Serge Baldwin</td>
<td>Data Coordinator</td>
<td>Singapore</td>
<td>64</td>
<td>2012/04/09</td>
<td>$138,575</td>
</tr>
<tr>
<td>Zenaida Frank</td>
<td>Software Engineer</td>
<td>New York</td>
<td>63</td>
<td>2010/01/04</td>
<td>$125,250</td>
</tr>
<tr>
<td>Zorita Serrano</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>56</td>
<td>2012/06/01</td>
<td>$115,000</td>
</tr>
<tr>
<td>Jennifer Acosta</td>
<td>Junior Javascript Developer</td>
<td>Edinburgh</td>
<td>43</td>
<td>2013/02/01</td>
<td>$75,650</td>
</tr>
<tr>
<td>Cara Stevens</td>
<td>Sales Assistant</td>
<td>New York</td>
<td>46</td>
<td>2011/12/06</td>
<td>$145,600</td>
</tr>
<tr>
<td>Hermione Butler</td>
<td>Regional Director</td>
<td>London</td>
<td>47</td>
<td>2011/03/21</td>
<td>$356,250</td>
</tr>
<tr>
<td>Lael Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>21</td>
<td>2009/02/27</td>
<td>$103,500</td>
</tr>
<tr>
<td>Jonas Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>30</td>
<td>2010/07/14</td>
<td>$86,500</td>
</tr>
<tr>
<td>Shad Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>51</td>
<td>2008/11/13</td>
<td>$183,000</td>
</tr>
<tr>
<td>Michael Bruce</td>
<td>Javascript Developer</td>
<td>Singapore</td>
<td>29</td>
<td>2011/06/27</td>
<td>$183,000</td>
</tr>
<tr>
<td>Donna Snider</td>
<td>Customer Support</td>
<td>New York</td>
<td>27</td>
<td>2011/01/25</td>
<td>$112,000</td>
</tr>
</tbody>
</table>
Javascript:
$(document).ready(function () {
var table = $('#example').DataTable({
"lengthMenu": [5, 10, 50, 100],
"pageLength": 50,
"scrollX": true,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
text: 'Export All',
exportOptions: {
columns: ':visible:not(.not-exported)'
},
title: 'Data export'
}, {
extend: 'excelHtml5',
text: 'Export selected',
exportOptions: {
columns: ':visible:not(.not-exported)',
modifier: {
selected: true
}
},
title: 'Data export'
}
],
select: {
style: 'multi'
}
});
});
jsfiddle:
https://jsfiddle.net/p8cymj4s/2/
这篇关于在Datatable中单击选择行并将所选数据导出为Excel的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
