how do i make a column sortable by dd/mm/YY with server side processing?
how do i make a column sortable by dd/mm/YY with server side processing?
rw1
Posts: 42Questions: 0Answers: 0
edit: i realised all the information i found and applied below did not apply to a server side processing environment, so it would be great if anyone could assist me to get this working in a server side environment.
it would also be great if the information at http://datatables.net/plug-ins/sorting#date_uk could be updated to reflect that the solution there does not work for server side processing.
thank you.
so my question is, in a server side processing environment, the third column field contents are in the format:
24/01/10
how do i make this column sortable by these types of values?
i have looked at:
http://datatables.net/plug-ins/sorting#date_uk
http://www.datatables.net/usage/columns#sType
and i'm not clear how to implement it.
it seems the logic is:
1. copy the code at:
http://datatables.net/plug-ins/sorting#date_uk
[code]
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"date-uk-pre": function ( a ) {
var ukDatea = a.split('/');
return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},
"date-uk-asc": function ( a, b ) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"date-uk-desc": function ( a, b ) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
} );
[/code]
2. paste it in a file and save it as ukdate.js
3. reference it with a script call after the datatables script but before the table. i've tried this and it is not working.
this is my head code:
[code]
$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bJQueryUI": true,
"bLengthChange": false,
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"aoColumnDefs": [
{
"aTargets": [ 0 ],
"mData": "0",
"mRender": function ( data, type, full ) {
return '' +data+ '';
}},
{
"aTargets": [ 4 ],
"mData": "4",
"mRender": function ( data, type, full ) {
return '' +data+ '';
}
}
],
"aoColumns": [
null,
null,
null,
{ "sType": "date-uk" },
null
],
"oLanguage": {
"sProcessing": "",
"sLengthMenu": "show _MENU_ records",
"sInfo": "showing _START_ to _END_ of _TOTAL_ records",
"sSearch": "search records: ",
"sInfoFiltered": "",
"oPaginate": {
"sFirst": "first",
"sPrevious": "previous",
"sNext": "next",
"sLast": "last"
}},
"sAjaxSource": "examples/server_side/scripts/server_processing.php",
"aLengthMenu": [[10, 20, 30, -1], [10, 20, 30, "all"]],
"iDisplayLength": 10,
"fnDrawCallback": function() {
$(".youtube", oTable.fnGetNodes()).colorbox({iframe:true, innerWidth:425, innerHeight:344, top: "100px"});
},
} );
} );
[/code]
thank you very much.
it would also be great if the information at http://datatables.net/plug-ins/sorting#date_uk could be updated to reflect that the solution there does not work for server side processing.
thank you.
so my question is, in a server side processing environment, the third column field contents are in the format:
24/01/10
how do i make this column sortable by these types of values?
i have looked at:
http://datatables.net/plug-ins/sorting#date_uk
http://www.datatables.net/usage/columns#sType
and i'm not clear how to implement it.
it seems the logic is:
1. copy the code at:
http://datatables.net/plug-ins/sorting#date_uk
[code]
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"date-uk-pre": function ( a ) {
var ukDatea = a.split('/');
return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},
"date-uk-asc": function ( a, b ) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"date-uk-desc": function ( a, b ) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
} );
[/code]
2. paste it in a file and save it as ukdate.js
3. reference it with a script call after the datatables script but before the table. i've tried this and it is not working.
this is my head code:
[code]
$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bJQueryUI": true,
"bLengthChange": false,
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"aoColumnDefs": [
{
"aTargets": [ 0 ],
"mData": "0",
"mRender": function ( data, type, full ) {
return '' +data+ '';
}},
{
"aTargets": [ 4 ],
"mData": "4",
"mRender": function ( data, type, full ) {
return '' +data+ '';
}
}
],
"aoColumns": [
null,
null,
null,
{ "sType": "date-uk" },
null
],
"oLanguage": {
"sProcessing": "",
"sLengthMenu": "show _MENU_ records",
"sInfo": "showing _START_ to _END_ of _TOTAL_ records",
"sSearch": "search records: ",
"sInfoFiltered": "",
"oPaginate": {
"sFirst": "first",
"sPrevious": "previous",
"sNext": "next",
"sLast": "last"
}},
"sAjaxSource": "examples/server_side/scripts/server_processing.php",
"aLengthMenu": [[10, 20, 30, -1], [10, 20, 30, "all"]],
"iDisplayLength": 10,
"fnDrawCallback": function() {
$(".youtube", oTable.fnGetNodes()).colorbox({iframe:true, innerWidth:425, innerHeight:344, top: "100px"});
},
} );
} );
[/code]
thank you very much.
This discussion has been closed.