Создать таблицу в JavaScript из возвращенного объекта JSON по http get

Question

Создать таблицу в JavaScript из возвращенного объекта JSON по http get

0

Это функция в моем javascript. Вызывается функцией onclick другой функцией.

    function getValueUsingParentTag(){

        var tv_type = [];
        var screen_size = [];
        var connectivity = [];
        var features = [];
        var chkArray = [tv_type,screen_size,connectivity,features];

        $("#tvtype input:checked").each(function() {
            tv_type.push($(this).val());
        });
        $("#screensize input:checked").each(function() {
            screen_size.push($(this).val());
        });
        $("#connection input:checked").each(function() {
            connectivity.push($(this).val());
        });
        $("#feature input:checked").each(function() {
            features.push($(this).val());
        });

        console.log(chkArray);
        //alert(JSON.stringify(chkArray));      
     alert('hello');

     $.get("output-tv.php",{tv_type:tv_type,screen_size:screen_size,connectivity:connectivity,features:features},function(chkArray){

        });
}

Это возвращаемый образец объекта json

 {"result":[
  {"product_code":"B2810","tv_name":"32B2810","size":"32","tv_type":"INTERNET TV"},
  {"product_code":"B2610","tv_name":"48B2610","size":"48","tv_type":"INTERNET TV"}
 ]}

Мне нужно создать таблицу в javascript на основе возвращаемого объекта json. Я не знаю, как это сделать. Пожалуйста помоги.

Kyemme 23 май 2014, в 14:26

Источник

0

Напишите цикл, который добавляет элементы $("<tr>") и $("<td>") со значениями, заполненными из результата.
Barmar 23 май 2014, в 11:58
0

Я не могу поверить, что урок, из которого вы узнали jQuery, не имеет примеров его использования для создания таблицы.
Barmar 23 май 2014, в 11:59

Теги:

javascript

jquery

arrays

json

multidimensional-array

3 ответа

0

Это будет так просто, используя JSRender. Я сделал скрипку, используя шаблон jsrender.

Использование скрипта JSRender

Madhu 23 май 2014, в 09:55

0

Вот простой пример цикла Javascript:

http://jsfiddle.net/mCLVL/

 var tableData = {"result":[
  {"product_code":"B2810","tv_name":"32B2810","size":"32","tv_type":"INTERNET TV"},
  {"product_code":"B2610","tv_name":"48B2610","size":"48","tv_type":"INTERNET TV"}
 ]};

var tableHTML = "<table>";

for (var i = 0; i < tableData["result"].length; i++) {
 tableHTML += "<tr>";
 tableHTML += "<td>" + tableData["result"][i]["product_code"] + "</td>";
 tableHTML += "<td>" + tableData["result"][i]["tv_name"] + "</td>";
 tableHTML += "<td>" + tableData["result"][i]["size"] + "</td>"; 
 tableHTML += "<td>" + tableData["result"][i]["tv_type"] + "</td>";
 tableHTML += "</tr>";  
}

tableHTML += "</table>";

console.log(tableHTML);

Bert Wagner 23 май 2014, в 09:24

Ещё вопросы

Напишите цикл, который добавляет элементы $("<tr>") и $("<td>") со значениями, заполненными из результата.
Я не могу поверить, что урок, из которого вы узнали jQuery, не имеет примеров его использования для создания таблицы.

Tom · Accepted Answer · 2014-05-23T10-35-00.000Z

следующая функция строит таблицу в строке.

function getTable(data) {
    var html = "";
    html += "<table><tr><td>product_code</td><td>tv_name</td><td>size</td><td>tv_type</td></tr>";
    html += "<tr>";
    for(var i = 0, ceiling = data.result.length; i < ceiling; i++) {
        var row = data.result[i];
        html += "<td>" + row.product_code + "</td>";
        html += "<td>" + row.tv_name + "</td>";
        html += "<td>" + row.size + "</td>";
        html += "<td>" + row.tv_type + "</td>";
    }
    html += "</tr>";
    html += "</table>";
    return html;
}

предположим, что у вас есть div с id mydiv, вы можете добавить таблицу в этот div следующим кодом:

document.getElementById("mydiv").innerHTML = getTable(data);

что вы подразумеваете под потолком? Я продолжаю получать данные не определены.
вы должны передать свой объект json этой функции; потолок - это длина массива результата в вашем объекте json. он используется для завершения цикла, когда это необходимо.