FixedColumns row grouping using the fixed column

eliasnoya

Hello everyone.
primarily, thanks for this great library.

I'm trying to achieve this visualization: http://www.datatables.net/release-datatables/extras/FixedColumns/row_grouping_height.html

i use the standard Prerequisites for generate the html table. http://datatables.net/usage/

And here´s is my config of Datatables, almost equal to Datatables example (1st link)

$(document).ready(function() {
var oTable = $('#reporte').dataTable({
"bJQueryUI": true,
"sScrollY": "450px",
"sScrollX": "100%",
"sScrollXInner": "150%",
"bScrollCollapse": true,
"bPaginate": false,
"aoColumnDefs": [ {"bSortable": false, "aTargets": ["mes"], "sType": ["currency"], "bSearchable": false},
{"aTargets": ["acumulado"], "sType": ["currency"], "bSearchable": false }
]
});
new FixedColumns( oTable, {
"iLeftWidth": 150,
"fnDrawCallback": function ( left, right ) {
var that = this, groupVal = null, matches = 0, heights = [], index = -1;

/* Get the heights of the cells and remove redundant ones */
$('tbody tr td', left.body).each( function ( i ) {
var currVal = this.innerHTML;

/* Reset values on new cell data. */
if (currVal != groupVal) {
groupVal = currVal;
index++;
heights[index] = 0;
matches = 0;
} else {
matches++;
}

heights[ index ] += $(this.parentNode).height();
if ( currVal == groupVal && matches > 0 ) {
this.parentNode.parentNode.removeChild(this.parentNode);
}
});
$('tbody tr td', left.body).each( function ( i ) {
that.fnSetRowHeight( this.parentNode, heights[ i ] );
});
}
});
});

I have two problems:
a) The fixed collumn work, but is included in the X Scroll.
b) The "vertical grouping" had no effect on the datatable.

Screenshoot:
http://s24.postimg.org/l1cgnr1f9/Untitled.jpg

I appreciate any help!

allan

Please link to a test case: http://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read .

Allan