简体   繁体   中英

How to parse json into html table?

I want to parse json data into a html table int format of :

project title         EAC     BAC    Overrun    Percentage

Project1              0 Day   0 Day   0             15%
closed
18/07/2016-18/08/2017


Project 2             350 Day 15 Day 15             30%
closed
05/02/2016-12/09/2022  

I found this answer Parsing JSON objects for HTML table which I used to write this code:

$.ajax(settings).done(function (result) {

             var str = JSON.stringify(result);
             obj = JSON.parse(str);
             for(var i = 0; i < obj.value.length; i++) {
                 tr = $('<tr/>');
                  tr.append("<td class=\"project_title\">" + obj.value[i].name + "</td>" + "<td class=\"project_title\">" + obj.value[i].eac + "</td>" + "<td class=\"project_title\">" +  obj.value[i].bac + "</td>" + "<td class=\"project_title\">" +  obj.value[i].overrun + "<td class=\"project_title\">" + obj.value[i].percentage +  "</td>");
                 $('table').append(tr);
             }
            });

But I didn't understand how to add the status of the project and the date in the same cell over Project title. For example for Project 1 I should add such status closed and the date of begin and end of the project 18/07/2016-18/08/2017 . How can I add these options to each project?

Just add </br> between the fields you want in the first cell:

tr.append("<td class=\"project_title\">" + obj.value[i].name + "</br>" + obj.value[i].attribute1 + "</br>" + obj.value[i].attribute2 + "</td>");

It may work in your case.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM