Clustered Table / subtotal sorting help
Clustered Table / subtotal sorting help
tkrausse
Posts: 2Questions: 0Answers: 0
http://live.datatables.net/bomogov/1/edit?html,js,output
What I'm trying to do is create a table with subtotal rows contained internally, and have each section sort independently. For example, lets say I want to look at my inventory, and have shortages separated from surpluses. I want the shortages in one section, with a subtotal, and the surpluses the same way. Each of those sections should sort independent of the other, with the subtotals remaining at the bottom of the respective sections.
I've come up with some expanded sort methods to handle this, but I'm finding that they function inconsistently. The first time you perform a sort on the page, it will sort correctly, but any subsequent sorts will not sort properly (although the items stay in their proper sections, and the subtotals do not move). This is the case even if the sort is a repeat of the original sort.
[code]
$.fn.dataTableExt.afnSortData['clustered'] = function(oSettings, iColumn)
{
//iColumn = item_table.fnColumnIndexToVisible(iColumn);
var aData = [];
$('td:eq(' + iColumn + ')', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
aData.push(this.parentNode.getAttribute('grouping') + ' ' + this.parentNode.getAttribute('rowtype') + ' ' + this.innerHTML);
} );
return aData;
}
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"clustered-numeric-pre": function ( a ) {
var a_fields = a.split(' ');
var a0 = parseInt(a_fields.shift());
var a1 = a_fields.shift();
var a2 = a_fields.join(' ');
switch(a1) {
case "head": a1 = 1; break;
case "body": a1 = 2; break;
case "foot": a1 = 3; break;
default: a1 = 4;
}
a2 = (a2=="-" || a2==="") ? 0 : a2*1;
a2 = parseFloat(a2);
return [a0, a1, a2];
},
"clustered-numeric-asc": function ( a, b ) {
if (a[0] != b[0]) {return a[0] - b[0];}
if (a[1] != b[1]) {return a[1] - b[1];}
return a[2] - b[2];
},
"clustered-numeric-desc": function ( a, b ) {
if (a[0] != b[0]) {return a[0] - b[0];}
if (a[1] != b[1]) {return a[1] - b[1];}
return b[2] - a[2];
},
"clustered-string-pre": function ( a )
{
var a_fields = a.split(' ');
var a0 = parseInt(a_fields.shift());
var a1 = a_fields.shift();
var a2 = a_fields.join(' ');
switch(a1) {
case "head": a1 = 1; break;
case "body": a1 = 2; break;
case "foot": a1 = 3; break;
default: a1 = 4;
}
if ( typeof a2 != 'string' ) {
a2 = (a2 !== null && a2.toString) ? a2.toString() : '';
}
return [a0, a1, a2.toLowerCase()];
},
"clustered-string-asc": function ( x, y )
{
if (x[0] != y[0]) {return x[0] - y[0];}
if (x[1] != y[1]) {return x[1] - y[1];}
return ((x[2] < y[2]) ? -1 : ((x[2] > y[2]) ? 1 : 0));
},
"clustered-string-desc": function ( x, y )
{
if (x[0] != y[0]) {return x[0] - y[0];}
if (x[1] != y[1]) {return x[1] - y[1];}
return ((x[2] < y[2]) ? 1 : ((x[2] > y[2]) ? -1 : 0));
}
} );
[/code]
Any ideas on what isn't working right with this?
What I'm trying to do is create a table with subtotal rows contained internally, and have each section sort independently. For example, lets say I want to look at my inventory, and have shortages separated from surpluses. I want the shortages in one section, with a subtotal, and the surpluses the same way. Each of those sections should sort independent of the other, with the subtotals remaining at the bottom of the respective sections.
I've come up with some expanded sort methods to handle this, but I'm finding that they function inconsistently. The first time you perform a sort on the page, it will sort correctly, but any subsequent sorts will not sort properly (although the items stay in their proper sections, and the subtotals do not move). This is the case even if the sort is a repeat of the original sort.
[code]
$.fn.dataTableExt.afnSortData['clustered'] = function(oSettings, iColumn)
{
//iColumn = item_table.fnColumnIndexToVisible(iColumn);
var aData = [];
$('td:eq(' + iColumn + ')', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
aData.push(this.parentNode.getAttribute('grouping') + ' ' + this.parentNode.getAttribute('rowtype') + ' ' + this.innerHTML);
} );
return aData;
}
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"clustered-numeric-pre": function ( a ) {
var a_fields = a.split(' ');
var a0 = parseInt(a_fields.shift());
var a1 = a_fields.shift();
var a2 = a_fields.join(' ');
switch(a1) {
case "head": a1 = 1; break;
case "body": a1 = 2; break;
case "foot": a1 = 3; break;
default: a1 = 4;
}
a2 = (a2=="-" || a2==="") ? 0 : a2*1;
a2 = parseFloat(a2);
return [a0, a1, a2];
},
"clustered-numeric-asc": function ( a, b ) {
if (a[0] != b[0]) {return a[0] - b[0];}
if (a[1] != b[1]) {return a[1] - b[1];}
return a[2] - b[2];
},
"clustered-numeric-desc": function ( a, b ) {
if (a[0] != b[0]) {return a[0] - b[0];}
if (a[1] != b[1]) {return a[1] - b[1];}
return b[2] - a[2];
},
"clustered-string-pre": function ( a )
{
var a_fields = a.split(' ');
var a0 = parseInt(a_fields.shift());
var a1 = a_fields.shift();
var a2 = a_fields.join(' ');
switch(a1) {
case "head": a1 = 1; break;
case "body": a1 = 2; break;
case "foot": a1 = 3; break;
default: a1 = 4;
}
if ( typeof a2 != 'string' ) {
a2 = (a2 !== null && a2.toString) ? a2.toString() : '';
}
return [a0, a1, a2.toLowerCase()];
},
"clustered-string-asc": function ( x, y )
{
if (x[0] != y[0]) {return x[0] - y[0];}
if (x[1] != y[1]) {return x[1] - y[1];}
return ((x[2] < y[2]) ? -1 : ((x[2] > y[2]) ? 1 : 0));
},
"clustered-string-desc": function ( x, y )
{
if (x[0] != y[0]) {return x[0] - y[0];}
if (x[1] != y[1]) {return x[1] - y[1];}
return ((x[2] < y[2]) ? 1 : ((x[2] > y[2]) ? -1 : 0));
}
} );
[/code]
Any ideas on what isn't working right with this?
This discussion has been closed.
Replies