DataTables how to use multiple data from json objects

Question

so what i'm trying to do is to call some data from a json file to fill my table. But instead of having a lot of json files, i'd like to keep some of the data in a single file. For example, i have 2 types of clients (person and company) and i want to keep them both in the same json, but as different objects, because each one goes in different table.

The problem is: I can't access the data in the JSON file.

I can use it normally if i use the 2 type of clients in different files (person.json and company.json - This works fine).

I did tried these 2 examples, but none of them worked for me.

So, how can i do get the data from the file? Here is my json and my datatable code:

{
    "clients": {
        "person": [
            {
                "cd":0,
                "id":"C-0010",
                "nm_cliente":"Name AAA",
                "dt_nasc":"02/11/1990",
                "info":"Some basic info"
            },
            {
                "cd":1,
                "id":"C-0013",
                "nm_cliente":"Name BBB",
                "dt_nasc":"02/11/1990",
                "info":"Some basic info"
            },
            {
                "cd":2,
                "id":"C-0017",
                "nm_cliente":"Name CCC",
                "dt_nasc":"02/11/1990",
                "info":"Some basic info"
            }
        ],
        "company": [
            {
                "cd":0,
                "id":"C-0032",
                "nm_cliente":"Name Client",
                "num_cnpj":"111.222.3333/0001-22",
                "nm_cidade":"City AAA"
            },
            {
                "cd":1,
                "id":"C-0033",
                "nm_cliente":"Client Name",
                "num_cnpj":"111.222.3333/0001-22",
                "nm_cidade":"City BBB"
            },
            {
                "cd":2,
                "id":"C-0035",
                "nm_cliente":"jEmpresa teste",
                "num_cnpj":"111.222.3333/0001-22",
                "nm_cidade":"City CCC"
            }
        ]
    }
}

I already used jsonlint.com to verify, and everything is ok with my JSON. And here is how i'm trying to call this data into my tables.

TableA - Client type Person

//rest of the code goes here...
"aoColumns" : [
    { "mData": "person.id" },
    { "mData": "person.nm_cliente" },
    { "mData": "person.dt_nasc" },
    { "mData": "person.info" }
]

TableB - Client type Company

//rest of the code goes here...
"aoColumns" : [
    { "mData": "company.id" },
    { "mData": "company.nm_cliente" },
    { "mData": "company.nm_cnpj" },
    { "mData": "company.nm_cidade" }
]

I keep getting error like "lenght not defined"

Can anyone help me?

davidkonrad · Accepted Answer · 2015-04-01 14:20:34Z

2

You must refer to the person and company arrays themselves, not the items. Updated to demonstrate initialization after load of JSON and how to reuse and manipulate the options :

//an options object, some example settings
var options = {
    bPaginate: true,
    sPaginationType: "full_numbers",
    aLengthMenu: [25,50,100,500]
    //etc 
}    

function initialize(json) {
     options.aaData = json.clients.person;
     options.aoColumns = [
           { "mData": "id" },
           { "mData": "nm_cliente" },
           { "mData": "dt_nasc" },
           { "mData": "info" }
        ];

    $("#tableA").dataTable(options);

    options.aaData = json.clients.company;
    options.aoColumns = [
           { "mData": "id" },
           { "mData": "nm_cliente" },
           { "mData": "num_cnpj" },
           { "mData": "nm_cidade" }
        ];

    $("#tableB").dataTable(options);
}

$.getJSON("your.json", function(json) {
   initialize(json);
});

original demo showing how to inject the JSON -> http://jsfiddle.net/3g5wcyet/

reuseable options demo -> http://jsfiddle.net/bpgvfefd/

edited Apr 1, 2015 at 14:20

answered Apr 1, 2015 at 13:46

davidkonrad

85.7k17 gold badges211 silver badges273 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

celsomtrindade Over a year ago

I'm getting this error: Uncaught ReferenceError: clients is not defined the difference between my code and your jsfiddel is that your data is within a var and i'm loading mine from a external json like this: ajax: {url: "data/c_clients.json"}, dataType: "json" Does this error has anything to do with it?

davidkonrad Over a year ago

@CelsomTrindade, yes - this is why you get that error, see updated answer.

celsomtrindade Over a year ago

do you know if there is other method to do this? because i have some other options in my tables (but i'll try your solution). Ps.: I'm not an advanced user in jquery

davidkonrad Over a year ago

@CelsomTrindade the datatables options is just an object you can reuse and manipulate as you wish, see updated and final answer.

Collectives™ on Stack Overflow

DataTables how to use multiple data from json objects

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related