I am using TableTools v2.2.2 and DataTables 1.10.0 and have it successfully exporting some table contents. However, it is not picking up the values from the checkboxes in the table cells. How can I extract the value as true or false (or 1,0; any indicator really) from the cells and make them export?
table = $('#sort1').DataTable({
stateSave: true,
filter: false,
"order": [[sortColumn, "asc"]],
"pageLength": 25,
"columnDefs": [
{
"targets": ['no-sort'],
"orderable": false,
},
],
"autoWidth": false,
"tableTools": {
"aButtons": [
{
"sExtends": "collection",
"sButtonText": "Export",
"aButtons": ["csv", "xls", "pdf", "print"],
// TODO: Get this working.
"fnCellRender": function ( sValue, iColumn, nTr, iDataIndex ) {
return " TableTools";
}
}
],
"sSwfPath": "/Scripts/plugin/datatables/TableTools/swf/copy_csv_xls_pdf.swf"
},
"initComplete": function (oSettings, json) {
$(this).closest('#sort1_wrapper').find('.DTTT.btn-group').addClass('table_tools_group').children('a.btn').each(function () {
$(this).addClass('btn-sm btn-default btn-primary');
});
if ($('td.dataTables_empty')) {
$('td.dataTables_empty').parent().hide();
}
},
// This sets the resulting html layout i.e. https://datatables.net/reference/option/dom
"dom": "<'dt-toolbar'<'col-xs-12 col-sm-6'f><'col-sm-6 col-xs-6 hidden-xs'lT>r>" +
't<"dt-toolbar-footer"<"col-sm-6 col-xs-12 hidden-xs"i><"col-xs-12 col-sm-6"p>><"clear">"'
});
You can see I've been trying to use fnCellRender and its anoynmous method, but even though I expect it to return " TableTools" for each cell, it returns nothing.
My table is here and is well-formed:
<table class="table table-bordered table-condensed table-hover table-responsive table-striped dataTable" id="sort1" aria-describedby="sort1_info" role="grid">
<thead>
<tr role="row"><th style="vertical-align: bottom; width: 1%;" class="no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="">
<input id="include" name="include" type="checkbox" value="true"><input name="include" type="hidden" value="false">
</th><th style="vertical-align: bottom; width: 20%;" class="sorting_asc" tabindex="0" aria-controls="sort1" rowspan="1" colspan="1" aria-sort="ascending" aria-label="&nbsp;: activate to sort column ascending"> </th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="Tax Agent">Tax Agent</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="AFSL">AFSL</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="Auditor">Auditor</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="Bankruptcy">Bankruptcy</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="Liquidator">Liquidator</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="BAS Agent">BAS Agent</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="SMSF Auditor">SMSF Auditor</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="CPA">CPA</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="ICAA">ICAA</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="CPA Certificate">CPA <br>Certificate</th><th class="center no-sort sorting_disabled" rowspan="1" colspan="1" aria-label="ICAA Certificate">ICAA <br>Certificate</th></tr>
</thead>
<tbody>
<tr role="row" class="odd">
<input type="hidden" name="AggregEntities.index" autocomplete="off" value="07c8ac97-6984-4f5a-b5bb-8d60888aaccf">
<input data-val="true" data-val-number="The field EntityId must be a number." data-val-required="The EntityId field is required." id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__EntityId" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].EntityId" type="hidden" value="232"><input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__Id" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Id" type="hidden" value="215"> <td class="center">
<label class="checkbox">
<input checked="checked" class="checked" data-val="true" data-val-required="The Include field is required." id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__Include" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Include" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Include" type="hidden" value="false">
<i></i>
</label>
</td>
<td class="sorting_1">
ACS Corporate Group
- <b><i>Anthony Bray</i></b>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__TaxAgent_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].TaxAgent.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].TaxAgent.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__AFSL_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].AFSL.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].AFSL.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__Auditor_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Auditor.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Auditor.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__Bankruptcy_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Bankruptcy.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Bankruptcy.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__Liquidator_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Liquidator.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].Liquidator.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__BASAgent_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].BASAgent.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].BASAgent.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__SMSFAuditor_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].SMSFAuditor.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].SMSFAuditor.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__CPA_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].CPA.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].CPA.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__ICAA_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].ICAA.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].ICAA.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__CPACertificate_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].CPACertificate.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].CPACertificate.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
<td class="center">
<span class="onoffswitch">
<input class="onoffswitch-checkbox" id="AggregEntities_07c8ac97-6984-4f5a-b5bb-8d60888aaccf__ICAACertificate_Switch" name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].ICAACertificate.Switch" readonly="readonly" type="checkbox" value="true"><input name="AggregEntities[07c8ac97-6984-4f5a-b5bb-8d60888aaccf].ICAACertificate.Switch" type="hidden" value="false">
<label class="onoffswitch-label" for="Switch">
<span class="onoffswitch-inner" data-swchon-text="Yes" data-swchoff-text="No"></span>
<span class="onoffswitch-switch"></span>
</label>
</span>
</td>
</tr>
</tbody>
<tfoot>
<tr><th colspan="2" class="text-align-right" rowspan="1">Total</th><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td><td class="text-align-center" rowspan="1" colspan="1">0 / 1</td></tr>
</tfoot>
</table>
Thanks, Rhys
The answer is provided here: http://datatables.net/forums/discussion/comment/66795#Comment_66795.
var table;
$(document).ready(function () {
//TODO: Get table tools working server-side e.g. https://github.com/ALMMa/datatables.mvc
table = $('#sort1').DataTable({
stateSave: true,
filter: false,
"order": [[sortColumn, "asc"]],
"pageLength": 25,
"columnDefs": [
{
"type" : "html",
"targets": ['no-sort'],
"orderable": false,
},
],
"autoWidth": false,
"tableTools": {
"aButtons": [
{
"sExtends": "collection",
"sButtonText": "Export",
"aButtons": [
{
sExtends: "csv",
"fnCellRender": renderColumn
},
{
sExtends: "xls",
"fnCellRender": renderColumn
},
{
sExtends: "pdf",
"fnCellRender": renderColumn
},
{
sExtends: "print",
}
]
}],
"sSwfPath": "/Scripts/plugin/datatables/TableTools/swf/copy_csv_xls_pdf.swf"
},
"initComplete": function (oSettings, json) {
$(this).closest('#sort1_wrapper').find('.DTTT.btn-group').addClass('table_tools_group').children('a.btn').each(function () {
$(this).addClass('btn-sm btn-default btn-primary');
});
if ($('td.dataTables_empty')) {
$('td.dataTables_empty').parent().hide();
}
$(this).closest('#sort1_wrapper').addClass('dataTables-scrollX');
},
// This sets the resulting html layout i.e. https://datatables.net/reference/option/dom
"dom": "<'dt-toolbar'<'col-xs-12 col-sm-6'fi><'col-sm-6 col-xs-6 hidden-xs'plT>r>" +
't<"dt-toolbar-footer"<"col-sm-6 col-xs-12 hidden-xs"i><"col-xs-12 col-sm-6"p>><"clear">"'
});
// Check all boxes.
$('#include').click(function () {
if (this.checked) {
$('.checked').prop('checked', true);
}
else {
$('.checked').removeAttr('checked');
}
});
$('.checked').click(function () {
checkInclude();
});
checkInclude();
});
// This extracts the value from the checkboxes
function renderColumn(value, column, row, iDataIndex) {
if (column != sortColumn && $(value).find('input.onoffswitch-checkbox').length > 0) {
return $(value).find('input.onoffswitch-checkbox').prop('checked');
}
return value;
}
It is a poor design function of TableTools at the moment, but is to be rewritten.