简体   繁体   中英

jQuery Datatables Handle Null sub objects

I am using jQuery DataTables but encountering issues when my JSON sub object is null . My JSON has a nested object address which can be null , thus address.streetAddress1 below returns an error/warning.

DataTables warning: table id=directory-table - Requested unknown parameter 'address.streetAddress1' for row 0. For more information about this error, please see http://datatables.net/tn/4

Is there a way to handle null values so it is just a blank string?

$(document).ready(function() {
    $('#directory-table').dataTable( {
        "lengthMenu": [ 10, 25, 50, 100 ],
        "dom": 'C<"clear">lfrtip',
        "ajax": {
            "url": "directory.json",
            "dataSrc" : ""
        },
        scrollX:true,
        "columns": [
            {"data" : "fileId"},
            {"data" : "fileName"},
            {"data" : "institutionId"},
            {"data" : "id"},
            {"data" : "firstName"},
            {"data" : "middleName"},
            {"data" : "lastName"},
            {"data" : "prefix"},
            {"data" : "suffix"},
            {"data" : "preferredName"},
            {"data" : "gender"},
            {"data" : "deleteFlag"},
            {"data" : "campusId"},
            {"data" : "buildingId"},
            {"data" : "primaryEmail"},
            {"data" : "secondaryEmail"},
            {"data" : "primaryPhone"},
            {"data" : "secondaryPhone"},
            {"data" : "address.streetAddress1"},
            {"data" : "address.city"},
            {"data" : "address.state"},
            {"data" : "address.zipCode"},
            {"data" : "orcid"},
            {"data" : "trResearcherId"},
            {"data" : "status.name"},
            {"data" : "roomNumber"},
            {"data" : "createdAt"},
            {"data" : "updatedAt"}
        ]
    } );
} );

This record has null for address :

{"fileId":2,"fileName":"9999_DIRECTORY.csv","institutionId":1,"id":"EVER1003","firstName":"George","lastName":"Clooney","middleName":null,"prefix":null,"suffix":null,"preferredName":null,"gender":"M","deleteFlag":"N","campusId":null,"primaryEmail":"cclooney","secondaryEmail":null,"primaryPhone":null,"secondaryPhone":null,"address":null,"buildingId":null,"orcid":null,"trResearcherId":null,"status":{"id":0,"name":"Processed"},"tags":null,"roomNumber":null,"createdAt":"2015-07-22 15:41 PM GMT","updatedAt":"2015-07-22 15:41 PM GMT"}

This record has an address :

{"fileId":2,"fileName":"9999_DIRECTORY.csv","institutionId":1,"id":"EVER1013","firstName":"Monica","lastName":"Galler","middleName":null,"prefix":null,"suffix":null,"preferredName":null,"gender":"F","deleteFlag":"N","campusId":"CAMP1000","primaryEmail":"monica@gmail.com","secondaryEmail":null,"primaryPhone":null,"secondaryPhone":null,"address":{"id":0,"streetAddress1":"123 Fake Street","streetAddress2":null,"city":"Cincinnati","state":"OH","stateId":0,"zipCode":"32444"},"buildingId":null,"orcid":null,"trResearcherId":null,"status":{"id":0,"name":"Processed"},"tags":null,"roomNumber":null,"createdAt":"2015-07-23 14:31 PM GMT","updatedAt":"2015-07-24 18:18 PM GMT"}

Use columns.defaultContent option.

According to the manual :

Additionally, this option can be useful when loading JSON data, as the value set here will be used if the cell value from the JSON is found to be null (for example, you might set a default string of "Not available.").

For example:

        {"data" : "address.streetAddress1", "defaultContent": ""},
        {"data" : "address.city", "defaultContent": ""},
        {"data" : "address.state", "defaultContent": ""},
        {"data" : "address.zipCode", "defaultContent": ""},

Using aoColumns you can specify a mRender parameter function call to check if the value in question is null. For example:

$(document).ready(function() {
  $('#directory-table').dataTable( {
    "lengthMenu": [ 10, 25, 50, 100 ],
    "dom": 'C<"clear">lfrtip',
    "ajax": {
        "url": "directory.json",
        "dataSrc" : ""
    },
    scrollX:true,
    "aoColumns": [
        {"mData" : "fileId",
         "mRender": function( data, type, full) {
           if( data !== null ){
             return data;
           }
           else{
             return "";
           }
         },
         //More column definitions

http://legacy.datatables.net/usage/columns

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM