отображать динамические данные в таблице данных из URL JSON

Question

У меня есть URL-адрес json, и я хочу динамически отображать эти данные json в таблице данных. У меня есть следующий код, но он не работает.

 $.ajax({
        url: 'https://jsonplaceholder.typicode.com/todos',
        data: {
            format: 'json'
        },
        error: function () {
            $('#info').html('<p>An error has occurred</p>');
        },
        dataType: 'json',
        success: function (data) {
            var col = [];
            var rdata = [];
            for (var i = 0; i < data.length; i++) {
                for (var key in data[i]) {
                    if (col.indexOf(key) === -1) {
                        col.push(key);
                    }
                }
            }

            for (var i = 0; i < data.length; i++) {
                for (var j = 0; j < col.length; j++) {
                    rdata.push(data[i][col[j]]);
                }
            }
           $('#displayTable').DataTable({
                "destroy": true,
                "data": rdata,
                "scrollX": "100%",
                "columns": col
            });
        },
        type: 'GET'
    });




});

его предоставление Невозможно использовать оператор 'in' для поиска 'length' в userId Может кто-нибудь, пожалуйста, помогите мне решить эту проблему. если вам нужно больше информации, я могу предоставить.

Answer 1

Попробуйте это

$.ajax({
        url: 'https://jsonplaceholder.typicode.com/todos',
        data: {
            format: 'json'
        },
        error: function () {
            $('#info').html('<p>An error has occurred</p>');
        },
        dataType: 'json',
        success: function (data) {
            var col = [];
            var rdata = [];
            $.each(data, function(index, element) {
                for (var key in element) {
                    if (col.indexOf(key) === -1) {
                        col.push(key);
                    }
                }
            }

            $.each(data, function(index, element) {
                for (var j = 0; j < col.length; j++) {
                    rdata.push(element[index][col[j]]);
                }
            }
           $('#displayTable').DataTable({
                "destroy": true,
                "data": rdata,
                "scrollX": "100%",
                "columns": col
            });
        },
        type: 'GET'
    });