No Sort one column with a specific class

Monico

Hey,

First, I would like to congratulate you for this work, it's very helpful.
However, I have a problem :)

I would like to disable sort to a specific column without use the option "aoColumns" because I use my code on differents tables who are not the same numbers of columns.
I thought to do a pre initialisation but I don't know what code to do.

My code :
[code]
// ## JS CODE ##
/* pre initialisation */
$('#table_stats thead th').each( function() {
if ($(this).hasClass('no_sort')) { /* what do here ? */ }
});

$('#table_stats').dataTable({
"bProcessing": true,
"bPaginate": true,
"bLengthChange": false,
"bFilter": false,
"bSort": true,
"bInfo": true,
"bAutoWidth": false,
"iDisplayLength":10,
"oLanguage": {
"sUrl": "./lang/table_stats_"+$('#langue').val()+".txt"
}
});

// ## HTML CODE ##



<?php echo $lang["stats"]["endsession"]; ?>
<?php echo $lang["stats"]["location"]; ?>
<?php echo $lang["stats"]["games"]; ?>
<?php echo $lang["stats"]["gainspertes"]; ?>
<?php echo $lang["stats"]["tablehour"]; ?>
<?php echo $lang["stats"]["bbhour"]; ?>
<?php echo $rec["texte"].$lang["stats"]["gainshour"]; ?>
 


...


// I have other tables with 2 or 10 columns, and I'll prefer to keep just one code
[/code]

I continue to search and thank you for your help.

allan

Hi Monico,

Interesting question - the way I would suggest doing it would be just after the DataTables initialisation to then remove the 'click' event handler on the TH.no_sort elements. Something like $(th.no_sort).unbind( 'click ); should do the trick nicely for you.

I'm been thinking about writing a plug-in for DataTables for a while now, which would basically build the initialisation object from attribute information in the DOM bSort="false" in a TH for example - this would be useful in this case. Hopefully get a chance to get around to it soon :-)

An alternative option also springs to mind - you could have a loop which goes over the TH elements and automatically constructs the aoColumns array for you based on the class information. I don't think either way is "better" than the other - it's up to you really...

Regards,
Allan

allan

Hello again,

Just had a thought - I think the second method would actually be better as DataTables would then apply the required classes to the TH elements. Otherwise you might need to remove/change the classes to make them look "not sortable".

Regards,
Allan

Monico

Thank you for your answer.

I think I prefer the second method too, but how do you construct the aoColumns in the pre initialisation ? I don't find a code in your site to realize this and I don't know how to do.

Thank you for your help

allan

Hi Monico,

Should be something as simple as:

[code]
var aoColums = [];
$('#example thead th').each( function () {
if ( $(this).hasClass( 'no_sort' ) {
aoColumns.push( { "bSortable": false } );
} else {
aoColumns.push( null );
}
} );
[/code]
Regards,
Allan

Monico

Perfect it's working ! :)
Thank you

I have just one question more :
In my columns, I have data like : "+150 €", "-34 €"... I push the numeric type on this columns but when I sort, it's not good, it's mix. I suppose than my "+" and my "€" are the problem, but how can I fixe it ?

Thank you again for your help.

allan

Hi Monico,

To do numeric sorting on data which also has non-numeric information in it, you can use a sorting plug-in. The one to use here would be the formatted numbers one: http://datatables.net/plug-ins/sorting#formatted_numbers

Regards,
Allan

webrunner

Thanks it worked for me too. Here is the full code for javascript beginners like me...

[code]
Sort meDon't sort me

$(document).ready(function() {
var dontSort = [];
$('#myData thead th').each( function () {
if ( $(this).hasClass( 'no_sort' )) {
dontSort.push( { "bSortable": false } );
} else {
dontSort.push( null );
}
} );
$('#myData).dataTable({
"aoColumns": dontSort
});
} );
[/code]

mgallin

Allan:

First, I thank you for this terrific effort.

I implemented the solution above to define columns sortable by class. However, it is limited to a single table on a page unless I create separate arrays and initializations for each table. Can you suggest a more elegant way of implementing this solution across multiple tables?

FlashJunior

i made it with html5 datatag.

looks like that:

[code]
...

var $table = $('#resulttable');
var oTableSettings = {};
oTableSettings.aoColumns = [];

$('thead th', $table).each(function(){
var obj = $(this);
var obj_d = obj.data("datatable");

if(obj_d && obj_d.bSortable !== undefined){
oTableSettings.aoColumns.push({"bSortable": obj_d.bSortable });
}else{
oTableSettings.aoColumns.push(null);
}

})
...
var oTable = $table.dataTable({
...
"aoColumns": oTableSettings.aoColumns
...
[/code]