Отобразить существующие данные JSON в матрицу, как таблица

user3280899 спросил: 03 ноября 2018 в 09:00 в: javascript

Я хотел бы отобразить данные json в таблицу. Попробовал шаблон значения ключа. Но не повезло. Кто-нибудь может мне предложить? Спасибо.

мои полные данные JSON содержат около 20 объектов. Это динамически создаваемая таблица в соответствии со значением другой таблицы - пример имеет 3. Таким образом, когда это три строки, только три строки должны быть заполнены из данных JSON, если они существуют. Например, если 5 строк, 3 строки должны быть заполнены из json, и две строки должны отображать '-'.

function setTrait_matrix() {

    var json_data = {
        Title1_Title1: "11yty",
        Title1_Title2: "12sdf",
        Title1_Title3: "1376",
        Title2_Title1: "21yu",
        Title2_Title2: "22",
        Title2_Title3: "235",
        Title3_Title1: "31",
        Title3_Title2: "32",
        Title3_Title3: "33"
    };

    var matrixVal = 3;

    if (matrixVal != 0 || matrixVal != null) {
        var root = document.getElementById("traits_matrix_Div");
        var table = document.createElement('table');
        table.className = "difftable";
        var tblB = document.createElement('tbody');
        table.appendChild(tblB);

        var firstList = {};
        for (var x = 1; x <= matrixVal; x++) {
            firstList['Title' + x] = 'Title' + x;
        }
        myData = Object.values(firstList);

        var tr = document.createElement('tr');
        tr.appendChild(document.createElement('th'));

        for (var j = 0; j < matrixVal; j++) {
            var th = document.createElement('th');
            var text = document.createTextNode(myData[j]);
            th.appendChild(text);
            tr.appendChild(th);
        }

        tblB.appendChild(tr);

        for (var i = 0; i < matrixVal; i++) {
            var tr = document.createElement('tr');
            tblB.appendChild(tr);

            var td = document.createElement('td');
            var text = document.createTextNode(myData[i]);
            td.appendChild(text);
            tr.appendChild(td);

            var thisMatrix = JSON.stringify(json_data);

            var curcolumn = i + 1;

            for (var j = 0; j < matrixVal; j++) {
                var input = document.createElement("input");
                input.type = "text";
                if (typeof thisMatrix !== 'undefined') {
                    var curValue = "jsonVal";
                } else {
                    var curValue = "-"
                }
                var col = j + 1;
                if (i >= 0 && j >= 0) {
                    input.name = "Title" + curcolumn + "_Title" + col;
                    input.value = curValue;
                    input.id = "Title" + curcolumn + "_Title" + col;
                }
                const td = document.createElement('td');
                td.appendChild(input);
                tr.appendChild(td);
            }
        }
        root.appendChild(table);
    }

}

<body onload="setTrait_matrix()">
    <div id="traits_matrix_Div" style="visibility:visible" style="border: 1px; height:200px; align: center;"></div>
</body>

Надеюсь, я не путаю. Пожалуйста, предложите мне!


0 ответов