multiple sTypes in one call to dataTables

jackiep

First let me say "Thank You" for the excellent work with dataTables! I am using it in several places on a new wordpress site and will be sending a donation your way.

I've run into an issue with sType. Because i have a lot of automatically generated pages, I have a generic call to dataTables and want to load in multiple sTypes for two different sort plug-ins. It seems that whichever sType is listed first in the aoColumnDefs gets executed properly but the second sType does not.

[code]
jQuery(document).ready(function($) { var title_array = document.title.split(" "); $("#" + title_array[0] + "-table").dataTable({ "aaSorting": [[ 9, "desc" ]], "bSortClasses": false, "asStripClasses":['even','odd'], "aoColumnDefs": [ { "sType": "flex_date", "aTargets": "div-date" }, { "sType": "p_span", "aTargets": "per-num" } ], "aLengthMenu": [[10, 50, 100, -1], [10, 50, 100, "All"]] }); } ) ;
[/code]

A click to the sort control of the second sType gets ignored on Firefox 3.6.10 and an "Error on page" complaint from IE 8.0.6001.18943.
I've tried this re-arranging the order to confirm that is what makes the difference in behavior.
FYI, the flex_date is a my own html variation of the dd/mm/yy plugin and p_span is now very stripped down for isolating this issue -- both test fine when put in the first spot of the aoColumnDefs.

Or maybe I am not listing the sTypes correctly??

Thanks in advance for the support. Please let me know if you have any questions.

allan

Hi jackiep,

I think the issue is that aTargets should be passed as an array, rather than a string: http://datatables.net/usage/columns#aTargets . This makes it possible to target multiple columns with a single column definition, but it does mean that array syntax must be used. So it would look something like this:

[code]

jQuery(document).ready(function($) {
var title_array = document.title.split(" ");
$("#" + title_array[0] + "-table").dataTable({
"aaSorting": [[ 9, "desc" ]],
"bSortClasses": false,
"asStripClasses":['even','odd'],
"aoColumnDefs": [
{ "sType": "flex_date", "aTargets": [ "div-date" ] },
{ "sType": "p_span", "aTargets": [ "per-num" ] }
],
"aLengthMenu": [[10, 50, 100, -1], [10, 50, 100, "All"]]
} );
} ) ;
[/code]
And that should do the trick :-)

Regards,
Allan

jackiep

Worked just fine
Thanks Allan for your quick response!
Jackie