DataTables: Read mulitidimensional array multidimensional?

FrazeColder

I have multiple datas which I all send via json_encode() from PHP to JavaScript. And because there are so many dates I pack them with arrays. At the end I have this JSON return:

[
    [
        {
            "daten": [
                "1",
                "2",
                "3",
                "4",
                "5",
                "6",
                "7",
                "8",
                "9",
                "10",
                "11",
                "12",
                "13",
                "14",
                "15",
                "16",
                "17",
                "18",
                "19",
                "20",
                "21",
                "22"
            ]
        },
        {
            "anzahl": [
                "1",
                "0",
                "0",
                "0",
                "0",
                "1",
                "0",
                "0",
                "0",
                "0",
                "0",
                "0",
                "0",
                "0",
                "1",
                "0",
                "0",
                "0",
                "0",
                "1",
                "1",
                "2"
            ]
        }
    ],
    [
        {
            "datum": [
                "01.12.2017",
                "06.12.2017",
                "20.12.2017",
                "21.12.2017",
                "22.12.2017",
                "22.12.2017"
            ]
        },
        {
            "link": [
                "https:\/\/radlvoo.de\/blog\/produkt\/diamant-elan-super-legere-h-2017-rh-groesse-60\/",
                "https:\/\/radlvoo.de\/blog\/produkt\/diamant-topas-villiger-s-2017-rh-groesse-53-2\/",
                "https:\/\/radlvoo.de\/blog\/produkt\/haibike-seet-hardfour-life-1-0-2017-rh-groesse-30\/",
                "https:\/\/radlvoo.de\/blog\/produkt\/bergamont-e-ville-xt-wave-2017-rh-groesse-56\/",
                "https:\/\/radlvoo.de\/blog\/produkt\/diamant-achat-esprit-dt-t-2017-rh-groesse-45\/",
                "https:\/\/radlvoo.de\/blog\/produkt\/scool-chix-pro-26-7-2016\/"
            ]
        },
        {
            "kategorie": [
                "TREKKINGR\u00c4DER",
                "CRUISER \/ RETRO",
                "KINDER- \/ JUGENDFAHRR\u00c4DER",
                "E-BIKES",
                "E-BIKES",
                "KINDER- \/ JUGENDFAHRR\u00c4DER"
            ]
        },
        {
            "count": [
                "2",
                "1",
                "1",
                "1",
                "1",
                "1"
            ]
        }
    ]
]

I do access those arrays like this:

var tmp = JSON.parse(result);
console.log("Daten: " + tmp[0][0].daten + " | Anzahl: " + tmp[0][1].anzahl + " | Daten: " + tmp[1][0].datum + "Anzahl: " + tmp[1][3].anzahl);

My problem right now is that DataTables always throws a error:

Uncaught SyntaxError: Unexpected token o in JSON at position 1
    at JSON.parse (<anonymous>)
    at dataSrc ((index):1096)
    at jquery.dataTables.min.js:18
    at ta (jquery.dataTables.min.js:40)
    at jquery.dataTables.min.js:48
    at i (jquery.dataTables.min.js:35)
    at Object.success (jquery.dataTables.min.js:35)
    at i (jquery.js:2)
    at Object.fireWith [as resolveWith] (jquery.js:2)
    at y (jquery.js:4)

There you can find this:
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

This is how my dataTables function looks like:

var contactsTable = function() {
          jQuery('#databaseTable').DataTable({
              serverSide: false,
              ajax: {
                  'url': (" /requestLeadClicksController.php?" + jQuery('#formToRequestLeadClicks').serialize()),
                  'type': 'GET',
                  dataSrc: function (json) {
                     json = JSON.parse(json);
                     return json.data;
                  },
              },
              iDisplayLength: 10,
              columns: [
                  { data: 'datum' },
                  { data: 'link' },
                  { data: 'kategorie' },
                  { data: 'count' }
              ],
          });
        };

        contactsTable();

That means, all comes down to the fact that DataTables cannot read the arrays inside the arrays. As you can see I already tried to parse them with JSON.parse()... How can I access my arrays?

Each index belongs to the same index on the result[1][0].datum, result[1][1].link, result[1][2].kategorie and result[1][3].count.

That means, row one in the table should look like this:

01.12.2017 - https:\/\/radlvoo.de\/blog\/produkt\/diamant-elan-super-legere-h-2017-rh-groesse-60\/ - TREKKINGR\u00c4DER - 2

Where is the problem? How can I fix the access array problem?

Kind regards

kthorngren

This page describes the supported data structures:
https://datatables.net/manual/data/#Data-source-types

Basically each array or group of objects represents a row. You would need to restructure your data either in the server script or in JS before presenting to Datatables.

Kevin

KungFuMonkey

I have a json object like the following:

var data = {"orders":[{"orderId":224765543,"orderNumber":"153058","orderKey":"292165352446-1556620619019","orderDate":"2018-04-13T08:51:36.0000000","createDate":"2018-04-13T09:04:49.5670000","modifyDate":"2018-04-24T01:50:59.1470000","paymentDate":"2018-04-13T08:51:37.0000000","shipByDate":null,"orderStatus":"shipped"}],"total":1,"page":1,"pages":1};

I want to access the orderNumber value so I use:

$('#data').DataTable( {
                    data: data,
                    "scrollY": "600px",
                    "scrollCollapse": true,
                    pageLength: 1000,
                    columns: [
                        { data: 'orders.[].orderNumber' }
                    ]
})

But nothing is returned, what am I doing wrong?
Thanks.

kthorngren

Try this:

$('#data').DataTable( {
                    data: data.orders,   //get the orders object
                    "scrollY": "600px",
                    "scrollCollapse": true,
                    pageLength: 1000,
                    columns: [
                        { data: 'orderNumber' }
                    ]
})

Kevin