Adding "Save" button, PDF,XLS,CSV

BernardoLima

How do I add the button "Save" from this example?
http://datatables.net/release-datatables/extras/TableTools/bootstrap.html

I've tried to add it, but I don't know how to do it, I want to add the button to my current table.

Here's my current code:
[code]
var editor; // use a global for the submit and return data rendering in the examples

$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
"ajaxUrl": "php/browsers.php",
"domTable": "#example",
"fields": [
{
"label": "Nome",
"name": "nome",
"type": "text"
},
{
"label": "Email",
"name": "email",
"type": "text"
},
{
"label": "Administrador",
"name": "administrador",
"type": "select",
"ipOpts": [
{
"label": "Sim",
"value": "Sim"
},
{
"label": "N\u00e3o",
"value": "N\u00e3o"
}
]
},
{
"label": "Senha",
"name": "senha",
"type": "password"
}
]
} );


$('#example').dataTable( {
"sDom": "<'row-fluid'<'span6'T><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
"sAjaxSource": "php/browsers.php",
"aoColumns": [
{ "mData": "nome" },
{ "mData": "email" },
{ "mData": "administrador" }
],
"oTableTools": {
"sRowSelect": "multi",
"aButtons": [
{ "sExtends": "editor_create", "editor": editor },
{ "sExtends": "editor_edit", "editor": editor },
{ "sExtends": "editor_remove", "editor": editor }
]
}
} );
} );

[/code]

allan

In your TableTools `aButtons` array, simply add a `'csv'` option.

Allan

BernardoLima

Hello allan,

I've tried to do that, but the table collapses.

Before adding a new option to aButtons:
http://i.imgur.com/kRjJbEM.png

After:
http://i.imgur.com/c2HtqVx.png

I have also tried to insert this parameter (with the correct path):
"sSwfPath" : "media/swf/copy_cvs_xls.swf"

PS: I have modified Editor/examples/bootstrap.html to my needs, as you can see if I do not insert any new buttons or customizations (like column filtering,etc), it works properly, but if I try to insert something new it collapses.

BernardoLima

Solved, I forgot to import ZeroClipboard.js and the following CSS files:


@import "../../media/css/demo_page.css"; @import "/media/css/header.ccss";
@import "http://twitter.github.com/bootstrap/assets/css/bootstrap.css";
@import "http://datatables.github.com/Plugins/integration/bootstrap/dataTables.bootstrap.css";