Cannot get Buttons csv working in DataTables 1.10.11 - datatables

Question

I am upgrading an existing site that was using DataTables 1.9.4 and TableTools 2.0.3 to use DataTables 1.10.11. I cannot get the csv button to show up on my page.
I replaced
"oTableTools": {
"sSwfPath": "scripts/jquery/TableTools-2.0.3/media/swf/copy_csv_xls.swf",
"sRowSelect": "multi",
"aButtons": [
{
"sExtends": "text",
"sButtonText": t.cmdMarkSelectedInvoiced,
"fnClick": function (nButton, oConfig, oFlash) {
vr.markSelectedInvoiced();
}
},
{
"sExtends": "csv",
"sButtonText": t.cmdExportSelectedToCSV,
"bSelectedOnly": true
},
{
"sExtends": "csv",
"sButtonText": t.cmdExportAllToCSV
},
{
"sExtends": "select_none",
"sButtonText": t.cmdDeselectAll
}
]
},
with
"buttons": ['csv'],
the new initialization for the datatable is:
var bla = $('#someelement').DataTable({
"buttons": [
'csv'
],
"pagingType": "simple",
"destroy": true,
"stateSave": true,
"stateSaveCallback": function (settings, data) {
vr.saveDtState(data);
},
"stateLoadCallback": function (settings) {
return vr.dtSavedState(settings);
},
"pageLength": 10,
"language": {
"emptyTable": t.tblInfoNoDesignRequestFound,
"infoEmpty": t.tblInfoNoDesignRequestFound,
"zeroRecords": t.tblInfoNoDesignRequestFound,
"info": ct.tblInfoTxtDisplayingXtoYofTotal,
"infoFiltered": ct.tblInfoTxtFilteredFromMax,
"lengthMenu": ct.tblInfoTxtShow + ' <select>' + '<option selected value=10>10</option>' + '<option value=15>15</option>' + '<option value=20>20</option>' + '<option value=25>25</option>' + '<option value=-1>' + ct.txtAll + '</option>' + '</select> ' + ct.tblInfoTxtRows,
"search": ct.tblInfoTxtFilter,
"paginate": {
"next": ct.tblInfoTxtNextPage,
"previous": ct.tblInfoTxtPreviousPage
}
},
"ordering": true,
"order": [],
"stripeClasses": [
'myodd',
'myeven'
],
"data": vr.dataObj.data,
"columns": [
{
"data": "companyLocation",
"title": ct.chCompanyLocation
},
{
"data": function (source, type, val) {
if (type === 'display' || type === 'filter') {
return u.jsonToLocalDate(source.requestStatusDateUtc, false);
}
return source.requestStatusDateUtc;
},
"title": ct.chDate
},
{
"data": function (source, type, val) {
return vr.formattedNameSizeAndOrient(source, type)
},
"title": ct.chLogoName
},
{
"data": function (source, type, val) {
return vr.formattedDrInfo(source, type)
},
"title": ct.chDRNumber
},
{
"data": "requestStatusDescription",
"title": ct.chStatus
},
{
"data": "invoiceAmount",
"title": ct.chInvoiceAmount,
"orderable": false,
"className": "rightJustify"
},
{
"data": "invoiceCurrency",
"bSortable": false
},
{
"data": "requestedBy",
"title": ct.chCreatedByName,
"orderable": false
}
],
"initComplete": function () {
vr.loadColumnSelects('viewRequestsDataTable', this, columnSelects);
}
});

Answer 1

You need to specify the dom: parameter.