I'm trying hard to understand the DataTables documentation, and I'm looking for examples, but I just don't get how to handle null values.

In SQL, I send a JSON string back to my JS app. I discovered I had to use INCLUDE_NULL_VALUES -- so, I'm no longer missing anything in the JSON array/object.

Here's how I'm populating the table. My ary is an array of objects with data like this:

ary = [{"Effective Date":"2001-07-01","Schedule":"UR-FUPA","Description":"High Up Dude","Calculated":"No","Base Schedule":"","Factor":null}, {...}, {...}]

$("#tblSomeTable").DataTable({
    "data": ary,
    "columns": [
        {
            "data": "Effective Date"
        },
        {
            "data": "Schedule"
        },
        {
            "data": "Description"
        },
        {
            "data": "Calculated"
        },
        {
            "data": "Base Schedule"
        },
        {
            "data": "Factor"
        }
    ],
    "columnDefs": [{
        "targets": _all,
        "defaultContent": ""
    }],
    "paging": false,
    "ordering": true,
    "info": false,
    "searching": false,
});

So, how do I set the default content to an empty string if the cell has no data?

You can see above that I tried to use the "defaultContent" option to target all columns, but that is not working.

I always appreciate your help. I'm not asking you to do my work, I just need an example I can understand, and your guidance in the right direction.

I'm trying hard to understand the DataTables documentation, and I'm looking for examples, but I just don't get how to handle null values.

In SQL, I send a JSON string back to my JS app. I discovered I had to use INCLUDE_NULL_VALUES -- so, I'm no longer missing anything in the JSON array/object.

Here's how I'm populating the table. My ary is an array of objects with data like this:

ary = [{"Effective Date":"2001-07-01","Schedule":"UR-FUPA","Description":"High Up Dude","Calculated":"No","Base Schedule":"","Factor":null}, {...}, {...}]

$("#tblSomeTable").DataTable({
    "data": ary,
    "columns": [
        {
            "data": "Effective Date"
        },
        {
            "data": "Schedule"
        },
        {
            "data": "Description"
        },
        {
            "data": "Calculated"
        },
        {
            "data": "Base Schedule"
        },
        {
            "data": "Factor"
        }
    ],
    "columnDefs": [{
        "targets": _all,
        "defaultContent": ""
    }],
    "paging": false,
    "ordering": true,
    "info": false,
    "searching": false,
});

So, how do I set the default content to an empty string if the cell has no data?

You can see above that I tried to use the "defaultContent" option to target all columns, but that is not working.

I always appreciate your help. I'm not asking you to do my work, I just need an example I can understand, and your guidance in the right direction.

• javascript
• jquery
• t-sql
• datatables

2 Answers 2

You need to specify _all as string as target option takes integer and string values.

So just update columnDefs as`

"columnDefs": [{
    "targets": '_all',
    "defaultContent": ""
}],

Your Example forked jsfiddle working demo: https://jsfiddle/mmushtaq/5pgp2479/

Source : columnDefs.targets

I don't believe there is current support for setting defaultContent in columnDefs. You would need to set it per column.