Hide some rows with a button

fedefazz

Hi i have data table implemented in a site. Here its a demo like the original one.
http://eliseoweb.com.ar/test/

I Have some rows (background green) that have a status field = delivered. I would like to implement a button, in the top, next to export button, that hide/show this rows whit status delivered. Because when there are too many rows whit status delivered the table turns very confused to read and to find those taht aren delivered.

Thaks all

Federico

allan

I would suggest a custom button that will trigger filtering on the table. Perhaps using column().search() for example.

Allan

fedefazz

Allan thanks for the answer. First of all i tried to put a custom buttom. I m getting "undefined bottom type: alert". The alert type is one in a DataTable example. I put all just like the example

I put this before par of the code before

$('#example').DataTable( {
$.fn.dataTable.ext.buttons.alert =
{className: 'buttons-alert',
action: function ( e, dt,node, config ) {
alert( this.text() );}};

and this part of the code in the tabletools

tableTools: {
sRowSelect: "os",
sRowSelector: 'td:first-child',
sSwfPath: "TableTools/swf/copy_csv_xls_pdf.swf",
aButtons: [
{ sExtends: "editor_create", editor: editor },
{ sExtends: "editor_edit", editor: editor },
{ sExtends: "editor_remove", editor: editor },
{
sExtends: "collection",
sButtonText: "Exportar",
sButtonClass: "save-collection hidden-xs",
aButtons: [ 'copy', 'csv', 'xls', 'pdf' ]
},{
sExtends: "print",
sButtonText: "Imprimir",
sButtonClass: "hidden-xs",
sInfo: "Presiones la tecla 'Escape' para salir"
},
{
extend: 'alert',
text: 'My button 1'
}
]
},

I tried changing to another type, like select_single and works fine. i trie with type "Sextend" too and the same. Thaks. Federico

allan

The documentation I linked to was for the Buttons extension. If you are using the legacy TableTools software you would need to create a button in the style that TableTools uses - specifically you'd need to use fnClick as the action.

Allan

fedefazz

Hi Allan im still with this issue. i tried to do this
"sExtends": "text",
sButtonText: "Hide Reds",
"fnClick": function ( nButton, oConfig, oFlash ) {
table.rows('.fondo_rojo').css({"display":"none"})

But doesent work. Coud you tell me how i put a button that hide/show the red rows. Sorry if i dont understand your previous answers but the language and the code are driving me crazy.

here is the link of the demo
http://eliseoweb.com.ar/test/

Tanks, Federico

BoltBait

I did something similar here: http://datatables.net/forums/discussion/comment/85937

allan

table.rows('.fondo_rojo').css({"display":"none"}

There is no rows().css() API method in DataTables. That should be throwing an error in your Javascript console stating this fact. Is it not? It appears to when I load your page.

If you want to remove rows in a DataTable you need to use filtering - the documentation for how to create a custom filter is available here.

Alternatively, if you have the data you want to filter on in a column, then use column().search().

Allan