using rendered filter value for range search?

bennyk

Hello,
I just strated with DT and it's amazing!

One problem I cannot solve even with Google's help:

I have a table with very large values (ajax-sourced data with client-side processing), and by using custom render I display 123000 as 123K:

$.fn.dataTable.render.kilo = function () {
  return function(data, type, row){
   var value = (data / 1000);
       if (type !== 'display') {
      return value;
    } else {

   if (data < 10000)  {return $.fn.dataTable.render.number( ',', '.',1, '', 'K' ).display(value)}
    else  {return $.fn.dataTable.render.number( ',', '.',0, '', 'K' ).display(value)} 
    }
 }
};

This works fine for displaying values, but filtering (using yadcf or custom range search function) still works with underlying values.. so searching for min=123000 returns 123K, yet UX-wise it's better if searching for min=123 returned 123K.

I also tried:

{ data: 1, 
  render: {display: $.fn.dataTable.render.kilo(),
  filter: {function ( data, type, row ) {return value = data / 1000}}

but still, min=123 means matches 123+, not 123k+.

My last resort would be re-calculating values upon init, so all values are pre-divided already, but i'd like to keep original values for precision (as they're used in other columns formulas)... and kinda curious where i'm wrong with my rendering approach.

Thanks heaps for your help!

colin

Hi @bennyk ,

Would you be able to link to a page demonstrating the problem, or create a fiddle on live.datatables.net, that would help to see the problem in action,

Cheers,

Colin

bennyk

Thanks for following up,
I ended up wrapping both renders (filter and display) in a single function, and now everything works as expected:

$.fn.dataTable.render.kilo = function () {
  return function(data, type, row){
   var value = (data / 1000);
   if (type === 'display') {
     if (data < 10000)  {return $.fn.dataTable.render.number( ',', '.',1, '', 'K' ).display(value);}
      else  {
        return $.fn.dataTable.render.number( ',', '.',0, '', 'K' ).display(value);} 
      }
      else if (type === 'filter') {
        return value;} 

      return data;
      };
    };

{ data: 1, 
  title: "in", 
  name: "in", 
  searchable: true,
  render: $.fn.dataTable.render.kilo()
 },