Menu
Here is a sample of my datatables config
{
"dom" : "rltip",
"processing" : true,
"serverSide" : false,
"order" : [ [ 1 , "desc" ] ],
"searching" : false,
data: [
{ "column-a" : "Sample Data A" , "column-b" : 10 , "column-c" : "Blah Blah" },
{ "column-a" : "Sample Data B" , "column-b" : 5 , "column-c" : "Blah Blah" },
{ "column-a" : "Sample Data C" , "column-b" : 38 , "column-c" : "Blah Blah" }
],
"columnDefs" : [
{
"targets" : 0,
"orderable" : false,
"data" : "column-a"
},
{
"targets" : 1,
"orderable" : false,
"data" : "column-b"
},
{
"targets" : 2,
"orderable" : true,
"className" : "title",
"data" : "column-c"
}
]
}
I wanted to format the data on display, but on sorting and other backend related stuff, i want to use the raw unformated data.
Important: I must do this on client side ( javascript ).
I already tried the render function callback on the columnDefs but it doesn't seem to work.
"render" : function( data , type , row ) {
if ( type === "sort" )
return data;
// format data here
return data; // This is a formatted data
}
What i mean about "it doesn't seem to work" is the sorting is broken, it will take in consideration the formatted data, not just the raw data.
I found this old related article but it doesnt seem to be applicable anymore to the newer version of datatables.net
https://datatables.net/forums/discussion/8249/filtering-using-the-rendered-text-however-sorting-using-the-original-value
I am using version 1.10.15
946
Using the order initialisation parameter, you can set the table to display the data in exactly the order that you want. The order parameter is an array of arrays where the first value of the inner array is the column to order on, and the second is 'asc' (ascending ordering) or 'desc' (descending ordering) as required.
Sorting in DataTables is based on the detected type of the data column (you can add your own type detection functions, or override automatic detection using sType). With this specific type given to the column, DataTables will apply the required sorting function.
Using the aaSorting initialisation parameter, you can get the table exactly how you want to present the information. The aaSorting parameter is an array of arrays where the first value is the column to sort on, and the second is 'asc' or 'desc' as required (it is a double array for multi-column sorting).
render which can be used to process the content of each cell before the data is used. columns. render has a wide array of options available to it for rendering different types of data orthogonally (ordering, searching, display etc), but it can be used very simply to manipulate the content of a cell, as shown here.
The render function is called multiple times with different values in type. If you set the unformatted data only to the type sort, you miss other for the sorting relevant types like type. Instead handle the case of type display and return the unformatted data for any other value in type.
"render" : function( data , type , row ) {
if ( type === "display" )
{
// format data here
return data; // This is formatted data
}
return data; // This is unformatted data
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
