Answers

• allan Posts: 61,972Questions: 1Answers: 10,160 Site admin

  January 2023

  I think your best bet will probably be to use a renderer. You can have it check for both the display data type and a zero value. If both are turn then return an empty string. That way the underlying data isn't affected at all and can still be used for calculations (i.e. the column().data() etc methods will still work just fine).

  Allan
• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  January 2023

  I find that if I simply remove the zero from the cell, my footer calculations throw NaN error.

  How are you doing this?

  Here is a simplistic example based on the footercallback example example that show an empty cell if the value is 0. It uses orthogonal data to display an empty cell if the cell data is 0.
  http://live.datatables.net/nucasizi/1/edit

  Maybe either of these examples will help or maybe you can update my example to show the issue you are having so we can offer suggestions.

  Kevin
• jackalbright Posts: 14Questions: 4Answers: 0

  January 2023

  Thanks Kevin and Allan,

  Using a renderer on each column of data fixed my problem, like this:

  render: function (data, type, row) {
  if (type === 'display' && data === 0) {
  return '';
  }
  return data;
  }
• jackalbright Posts: 14Questions: 4Answers: 0

  January 2023

  following up on my most recent response, Kevin's solution worked in not displaying zero values. However, now tolocalestring doesn't do currency formatting.

  When I simply do this, the currency displays properly:
  render: $.fn.dataTable.render.number( ',', '.',0, '$' )

  However, when I do this, the number simply displays as a non-formatted number:
  "render": function (data, type, row) {
  //console.log(data);
  if (type === 'display' && data === 0) {
  return '';
  }else{
  return data.toLocaleString("en-US",{style: 'currency',currency: 'USD'});
  }
  }
• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  January 2023

  You can chain display( data ) to $.fn.dataTable.render.number( ',', '.',0, '$' ) and use it in columns.render. Updated example:
  http://live.datatables.net/nucasizi/3/edit

  Also the example shows that return data.toLocaleString("en-US",{style: 'currency',currency: 'USD'}); works. You can switch the comments for the return statements to see. If you want this debugged then please show an example of the problem.

  Kevin
• jackalbright Posts: 14Questions: 4Answers: 0

  January 2023

  Thanks once again. That worked for me.

  Question though. Why does this use of render yield a good result
  {
  "data": "january" ,
  "width": "8%",
  render: $.fn.dataTable.render.number( ',', '.',0, '$' )
  },

  While this one requires me to chain display(data) to the .number() function?
  render: function (data, type, row) {
  if (type === 'display' && data === 0) {
  return '';
  }
  return $.fn.dataTable.render.number( ',', '.',0, '$' ).display(data);
  }
• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  January 2023 edited January 2023 Answer ✓

  render: $.fn.dataTable.render.number( ',', '.',0, '$' )

  This replaces the columns.render function with the $.fn.dataTable.render.number( ',', '.',0, '$' ) function which receives the columns.render function paramters data, type and row. It will automatically use the data parameter.

  return $.fn.dataTable.render.number( ',', '.',0, '$' ).display(data);

  To use that renderer independently, whether its a return in columns.render or somewhere else, you need to pass in the data by chaining .display(data).

  Kevin