Global Formatting for Custom Column Types

moegoewetter

Hi,

I have a website that can dynamically build a whole array of datatables based on the user's selection. Some of these "reports" have columns that are percentages. I have written a function for the sorting of the percentages, and use "fnRender" to format these percentage columns.

Is there a way that I can give a column a custom sType (for example: "t_percentage") and have one global plugin/function that will render the data in those columns with a percentage sign?

Instead of declaring the fnRender function for each column:
[code]
{ "aTargets": ["{tableid}_g_c_2"],
"bVisible":true, "sType":"t_percentage", "fnRender": function(o,val) { var nval = val+"%"); return nval; }, "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"},
"aTargets": ["{tableid}_g_c_3"],
"bVisible":true, "sType":"t_percentage", "fnRender": function(o,val) { var nval = val+"%"); return nval; }, "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"},
"aTargets": ["{tableid}_g_c_4"],
"bVisible":true, "sType":"t_percentage", "fnRender": function(o,val) { var nval = val+"%"); return nval; }, "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"},
"aTargets": ["{tableid}_g_c_5"],
"bVisible":true, "sType":"t_percentage", "fnRender": function(o,val) { var nval = val+"%"); return nval; }, "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"}
[/code]

I only need to set the sType to "t_percentage"
[code]
{ "aTargets": ["{tableid}_g_c_2"],
"bVisible":true, "sType":"t_percentage", "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"},
"aTargets": ["{tableid}_g_c_3"],
"bVisible":true, "sType":"t_percentage", "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"},
"aTargets": ["{tableid}_g_c_4"],
"bVisible":true, "sType":"t_percentage", "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"},
"aTargets": ["{tableid}_g_c_5"],
"bVisible":true, "sType":"t_percentage", "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"}
[/code]
Kind Regards,

allan

aTargets can have multiple 'targets' in it. It looks to me that all you need here is:

[code]
{ "aTargets": ["{tableid}_g_c_2", "{tableid}_g_c_3", "{tableid}_g_c_4", "{tableid}_g_c_5"],
"bVisible":true, "sType":"t_percentage", "sClass":"tright", "bSortable":true, "bSearchable":true, "sWidth": "12%"}
[/code]

However, no there isn't a way to specify the renderer based on the sType. I suppose it is possible with mRender as a function, but it seems a little bit involved when you can just specify mRender once (which btw I would recommend you use over fnRender which will be removed in DataTables 1.10).

Allan

moegoewetter

Hi Allan,

Thank you for your reply. The reason I don't specify the fnRender (or in mRender) for a whole lot of columns, is because the customer has customization on the way he wants to see the grid. I've written a separate app that builds the datatables init string based on his individual column selections.

Kind Regards,