How can I change numerical value formatting?

Alex1

Hi

I am using server side processing and DataTables is showing values as example ,2 as shown in the screenshot but I want these to be shown as 0.20.

Other values it is showing as 4 but I want 4.00 and so on.

Is it possible to do this in DataTables rather than adjusting SQL code? I rather keep SQL simple and do formatting on front end ...

Thanks,

Alex

bindrid

Yes, with the columns render function, you can make it look how ever you want
https://datatables.net/reference/option/columns.render
If you put render in the search box, there are lots of examples.

Alex1

Ok, I am making some progress but have an issue.

I have multiple tables on the same page (under different tabs), I initialise them all in a loop:

          $('table').each(function() {
              $(this).dataTable( {
                  ...
                  "columnDefs": [
                      {
                          "targets": [ 2 ],
                          "render": $.fn.dataTable.render.number( ',', '.', 2, '', 'm<sup>2</sup>' )
                      }
                  ],
                  ...
              });
          });

For some reason it does not have an effect on the table on the first active tab, but the tables under every other tab are using the render?

First active tab table: Capture1
All other tab tables: Capture 2

What is wrong?

Thanks,

Alex

allan

Just use:

$('table').DataTable( ... );

You don't need to do it in a look.

Aside from that, to be honest, I don't know what is wrong with what you have. We'd need a link to a test case showing the issue please.

Allan

Alex1

@allan I removed the loop and now every table has the same data?

I was using

                  "ajax": {
                          "data": {
                              "id": $('this').attr('data-product-group-id')
                          },
                          "url": "...",
                          "type": "POST"
                          },

so I changed it to

                  "ajax": {
                          "data": {
                              "id": $('table').attr('data-product-group-id')
                          },
                          "url": "...",
                          "type": "POST"
                          },

also.

Anyway about the actual issue here is an example of the data returned by the server side processing for the table where the formatting has no effect:

{"draw":1,"data":[["1","A...",",2"]],"recordsFiltered":1,"recordsTotal":1}

and here is an example of the data returned by the server side processing for the other tables where it works:

{"draw":1,"data":[["1","18mm ...","20,45"],["21","18mm ...","10,23"],["28","8mm ...","21,53"]],"recordsFiltered":3,"recordsTotal":3}

There seems to be no difference in the data?

allan

Yup - okay - I didn't know you were doing that, as it wasn't in your original post.

If you need to be able to reference the element as part of the initialisation options, you are correct, it would need to be in a loop.

We'd need a link to a page showing the issue to be able to offer any help, so we can see everything that is involved.

Allan

Alex1

@allan sorry what do you need? I have already shown DataTables options and resulting server side code. There isn't anything else that I can think of to show? Internal application so a link to it wouldn't work anyway.

Let me know what else is required :-)

bindrid

If you are still doing $('table').DataTable, that is your issue. Try changing your loop to something like

$('table[data-product-group-id]').each(function(idx, tbl){

    var dpgId = $(tbl).attr('data-product-group-id');

    $(tbl).DataTable({
       blah, blah, blah,
       serverSide:true,
       "ajax": {
           "data": {
                "id": dpgId },
           "url": "...",
        "type": "POST"
        },
       blah, blah, blah
    });

});

allan

Perhaps you can use JSFiddle or something to create a test case if the latest suggestion doesn't help.

The information to resolve the issue might indeed be in the posts above, but if it is, I'm missing it I'm afraid. That's why I would need a test case to debug.

Allan

bindrid

opps, wrong thread