Row & column filtering
Row & column filtering
Hello:
I'm using DataTables to implement a table that requires some advanced filtering on both the rows and the columns, where the data being filtered on is not actually in the table. I've mostly managed to get it working, but I've run into a few issues that I'm not sure how to fix.
First, I've noticed that after doing row filtering, sorting a column will undo the filtering, making all data visible. I'm using afnFiltering to handle the row filtering. Because our tables are quite large, I've put in code to prevent a complete table redraw in some cases, so depending on how event handling is done here I may be preventing the filtering event from occurring after sorting (if that's how it works). What might cause this problem, and is it possible that I'm preventing some sort of event from being handled?
The other issue is with regards to custom formatting in the column headings. I've set a custom value for column heading height in my css files (we are rotating our column heading text 90deg., so the default calculated height was not enough). However, after hiding some columns (using fnSetColumnVis), the height setting is no longer observed and the displayed column heading height is so small only the middle 4-5 letters of each heading are visible. How can I prevent this resizing from occurring?
My table initialization code is below. Unfortunately I can't make a demo available, but I can likely share a few more code snippets if needed.
[code]
$('#viewport').dataTable( {
"sDom" : '<"H"TC>rtf<"F"ip>',
"aaData" : {javascript array of arrays},
"aoColumns" : {property array setting sTitle, sType, asSorting, and sWidth},
"aaSorting" : [],
"aoColumnDefs" : [{"bVisible" : false, "aTargets" : [1,2]}],
// "oColVis" : {"aiExclude" : [0,1,2]},
"bJQueryUI" : true,
"bDeferRender" : true,
"bScrollInfinite" : true,
"sScrollX" : $('#viewport').width() + "px",
"sScrollY" : (entities * 100) < ($('#viewport').height() - 200)
? (entities * 100) + "px"
: ($('#viewport').height() - 200) + "px", // if few visible entities (i.e., 2),
// shrink sScrollY to prevent
// huge rows
"bScrollCollapse" : true,
"bPaginate" : false,
"bDestroy" : true,
"bProcessing" : true,
"bAutoWidth" : false,
"oTableTools" : {
"aButtons" : [ "copy", "csv", "xls", "pdf" ],
"sSwfPath" : "scripts/copy_cvs_xls_pdf.swf"
}
});
[/code]
I'm using DataTables to implement a table that requires some advanced filtering on both the rows and the columns, where the data being filtered on is not actually in the table. I've mostly managed to get it working, but I've run into a few issues that I'm not sure how to fix.
First, I've noticed that after doing row filtering, sorting a column will undo the filtering, making all data visible. I'm using afnFiltering to handle the row filtering. Because our tables are quite large, I've put in code to prevent a complete table redraw in some cases, so depending on how event handling is done here I may be preventing the filtering event from occurring after sorting (if that's how it works). What might cause this problem, and is it possible that I'm preventing some sort of event from being handled?
The other issue is with regards to custom formatting in the column headings. I've set a custom value for column heading height in my css files (we are rotating our column heading text 90deg., so the default calculated height was not enough). However, after hiding some columns (using fnSetColumnVis), the height setting is no longer observed and the displayed column heading height is so small only the middle 4-5 letters of each heading are visible. How can I prevent this resizing from occurring?
My table initialization code is below. Unfortunately I can't make a demo available, but I can likely share a few more code snippets if needed.
[code]
$('#viewport').dataTable( {
"sDom" : '<"H"TC>rtf<"F"ip>',
"aaData" : {javascript array of arrays},
"aoColumns" : {property array setting sTitle, sType, asSorting, and sWidth},
"aaSorting" : [],
"aoColumnDefs" : [{"bVisible" : false, "aTargets" : [1,2]}],
// "oColVis" : {"aiExclude" : [0,1,2]},
"bJQueryUI" : true,
"bDeferRender" : true,
"bScrollInfinite" : true,
"sScrollX" : $('#viewport').width() + "px",
"sScrollY" : (entities * 100) < ($('#viewport').height() - 200)
? (entities * 100) + "px"
: ($('#viewport').height() - 200) + "px", // if few visible entities (i.e., 2),
// shrink sScrollY to prevent
// huge rows
"bScrollCollapse" : true,
"bPaginate" : false,
"bDestroy" : true,
"bProcessing" : true,
"bAutoWidth" : false,
"oTableTools" : {
"aButtons" : [ "copy", "csv", "xls", "pdf" ],
"sSwfPath" : "scripts/copy_cvs_xls_pdf.swf"
}
});
[/code]
This discussion has been closed.
Replies
Still having issues with the first problem though, so any suggestions or help anyone can offer would be welcome. Thanks!