JSON data loading locally, by not when externalized

joseph.goncalves

New to dataTables. I first tried to load a table with dummy JSON data hardcoded from JS controller, this worked fine.
When i externalized this JSON data to a .json file called with ajax using datatable API, i get undefined length errors.
Here is the debug link.
http://debug.datatables.net/obosag
this is the method used to draw the table. it is called on page load.

popTable:function($table){
        var editor; 
            editor = new $.fn.dataTable.Editor( {
                table: "#contacts",
                fields: [ 
                    { label: "Product", name: "product" },
                    { label: "First name:", name: "first_name" },
                    { label: "Last name:", name: "last_name" },
                    { label: "Email Address:", name: "email" },
                    { label: "Title:", name: "title"},
                    { label: "Phone Number", name: "phone_number"}
                ]
            } );
         
            
            $('#contacts').DataTable( {
                dom: "Tfrtip",
                dataSrc: "ajax",
                dataType:"json", 
                ajax: getContactInfoURL,
                columns: [
                    { data: "first_name"},
                    { data: "last_name"},
                    { data: "email"},
                    { data: "title"},
                    { data: "product"},
                    { data: "phone_number"}
                ],
                tableTools: {
                    sRowSelect: "os",
                    aButtons: [
                        { sExtends: "editor_create", sButtonText: "<div class='dtt icon-plus icon-large icon-border'></div>", editor: editor },
                        { sExtends: "editor_edit",   sButtonText: "<div class='dtt icon-pencil icon-large icon-border'></div>", editor: editor },
                        { sExtends: "editor_remove", sButtonText: "<div class='dtt icon-trash icon-large icon-border'></div>", editor: editor }
                    ]
                }
            } );
        $table.find("th").attr("style","");
    }
};
    
$(document).ready(function(){
    $("#show-contact-us").click(function(){
        mashup.contactUs.tableInit();
        mashup.contactUs.popTable($(".contact-us-table"));
        mashup.contactUs.drawCloseout();
        $(".contact-us-container").toggleClass("shown");
    });
    $("body").on("click",".contact-close",function(){
        mashup.contactUs.closeContactPortlet(); 
    });
})

allan

Are you getting these errors when using the Editor functions? If so, it is because there is no ajax option specified - this is required as it tells Editor where to save the data (even if you use a function to override the default Ajax call).

Allan