Live DOM sorting
Live DOM sorting
jQuery 1.8.2
Datatables 1.9.4
I was just working on adding the Live DOM sorting features from this plug-in:
http://datatables.net/release-datatables/examples/plug-ins/dom_sort.html
and I wanted to mention a change that I made that I thought was important.
This plug-in allows you to sort on columns that contain input elements. It gives you the code for each type of input element and how to retrieve the value from that element to sort on. I ended up making a change to the "dom-select" function to sort on the text of the selected element rather than the value. Sorting by value would work in some instances where the text of the option element matched the value attribute. But this is not always the case.
I had an instance where the value was a database id key and the text was the name of a vendor, two very different values, below is an example:
[code]
Microsoft
Linux
Google
[/code]
If you were to sort (asc) on the value of the list above it sort it in the following order:
Microsoft
Linux
Google
I'd like it to sort in the following order
Google
Linux
Microsoft
I changed the dom-select afnSortData function as follows:
[code]
/* Create an array with the values of all the select options in a column */
$.fn.dataTableExt.afnSortData['dom-select'] = function ( oSettings, iColumn )
{
var aData = [];
$( 'td:eq('+iColumn+') select', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
aData.push( $("option:selected", this).text() );
} );
return aData;
}
[/code]
I'm not that well versed in jQuery to know if this is the most efficient method of implementing this.
Datatables 1.9.4
I was just working on adding the Live DOM sorting features from this plug-in:
http://datatables.net/release-datatables/examples/plug-ins/dom_sort.html
and I wanted to mention a change that I made that I thought was important.
This plug-in allows you to sort on columns that contain input elements. It gives you the code for each type of input element and how to retrieve the value from that element to sort on. I ended up making a change to the "dom-select" function to sort on the text of the selected element rather than the value. Sorting by value would work in some instances where the text of the option element matched the value attribute. But this is not always the case.
I had an instance where the value was a database id key and the text was the name of a vendor, two very different values, below is an example:
[code]
Microsoft
Linux
[/code]
If you were to sort (asc) on the value of the list above it sort it in the following order:
Microsoft
Linux
I'd like it to sort in the following order
Linux
Microsoft
I changed the dom-select afnSortData function as follows:
[code]
/* Create an array with the values of all the select options in a column */
$.fn.dataTableExt.afnSortData['dom-select'] = function ( oSettings, iColumn )
{
var aData = [];
$( 'td:eq('+iColumn+') select', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
aData.push( $("option:selected", this).text() );
} );
return aData;
}
[/code]
I'm not that well versed in jQuery to know if this is the most efficient method of implementing this.
This discussion has been closed.
Replies
Allan