NaN columnDefs

karlie

Hi, can somebody tell what I'm missing/doing wrong with the following code? The result in the front end is NaN being displayed rather than the desired result. Seem to be going round in circles trying to see what's wrong I'm sure somebody will spot it straight away and it's me being a bit slow!

{
                    targets: ['each_cost_price'],
                    render: function(data, type, row, meta) {
                        if (row['cost'] && row['unit'] && row['exrate'] !== null && data == null) {
                            return (row['cost'] / row['exrate'] / row['unit']).toFixed(2);
                        } else {
                            return (data == null) ? "" : "£" + data;
                        }
                    }
                }

awelch

It is likely a problem with the line:

return (row['cost'] / row['exrate'] / row['unit']).toFixed(2);

If any of the values from the row contain characters other than numbers you will get the NaN return value. For example, if you have a unit in the cost column (i.e. £) along with the number amount.

tangerine

targets: ['each_cost_price'],

You don't need the brackets when your option is a string.

karlie

You don't need the brackets when your option is a string.

Thanks for that, it's good to know. I removed them, but the problem still exists.

If any of the values from the row contain characters other than numbers you will get the NaN return value. For example, if you have a unit in the cost column (i.e. £) along with the number amount.

The values are all numeric. A $ sign is prepended to the start of the cost price figure (but not stored that way in the DB). I tried removing this $ sign and I still get the NaN value appearing.

kthorngren

The values are all numeric

Are you sure that the numeric numbers aren't strings?

You can use parseFloat() to make sure. For example:

return (parseFloat(row['cost']) / parseFloat(row['exrate']) / parseFloat(row['unit'])).toFixed(2);

Or you can put some debugging code in your render function to see if any of the values are strings instead of numbers.

Kevin

karlie

Hi, those three columns are defined as numeric values in the database (decimals and integer) and only contain numbers. I tried using your code above, and I still saw NaN in the front end.

kthorngren

I tried using your code above, and I still saw NaN in the front end

Thats a Javascript error not a Datatables error. Without seeing the data returned its hard to say what the issue is. I would put some debugging statements in the render function to track down what is causing the NaN. Maybe check to see if each row element you are using and data is typeof number and if not output a console.log message.

Kevin

karlie

Well I have solved this problem, but it still remains a bit of a mystery. All I did was change the class name of the column from exrate to ex_rate which then produced the expected result. Completely baffling!

//Each Cost Price
                {
                    targets: "each_cost_price",
                    render: function(data, type, row, meta) {
                        if (row["cost"] && row["ex_rate"] && row["unit"] !== null) {
                            return "£" + (row["cost"] / row["unit"] / row["ex_rate"]).toFixed(2);
                        }
                        if (data == null) {
                            return "";
                        }
                        else {
                            return "£" + data;
                        }
                    }
                }

The above code now works.