insert the json parsed values into tables

Question

helo i have tried hard in styling the json values that are printed randamoly in page ,here that are 4 categories,what i am doing with javascript is finding the lenght of the json array containing many objects ,then taking the type id ,as it is common in all array ,to determine whether they belong to 0,1,2,3 category ,then printing all the elements in the json array and so on ,here i would like to create table for each category and push all the corresponding id's to the table rows.

var txt = '<?php echo $response ?>';
//alert(txt);
//var jsonData = eval ("(" + txt + ")");
var jsonData = JSON.parse(txt);
for (var i = 0; i < jsonData.account_detail.length; i++) {
var counter = jsonData.account_detail[i];
//console.log(counter.counter_name);
//alert(counter.type);
document.write("<table border="0" width="500>">")
if(counter.type=="0")
    {

      document.write(counter.building_name);
      document.write(counter.org_name);
      document.write(counter.user_name);
      document.write(counter.name);
      document.write(counter.loc_name);
      document.write(counter.email_id);
      document.write(counter.password);

    }
if(counter.type=="1")
    {
        document.write(counter.user_name);
        document.write(counter.name);
        document.write(counter.password);
        document.write(counter.email_id);
    }
    if(counter.type=="2")
        {
            document.write(counter.building_name);
            document.write(counter.org_name);
            document.write(counter.user_name);
            document.write(counter.opr_code);
            document.write(counter.name);
            document.write(counter.loc_name);
            document.write(counter.email_id);
            document.write(counter.password);
        }
        if(counter.type=="3")
            {
               document.write(counter.building_name);
               document.write(counter.org_name);
               document.write(counter.machine_type);
               document.write(counter.activate_status);
               document.write(counter.machine_name);
               document.write(counter.entrance_exit_name);
               document.write(counter.entrance_or_exit);
               document.write(counter.loc_name);
               document.write(counter.activation_code);
            }
}
document.write("</table>")

Is there a reason you are doing this with JS. You could use PHP's method json_decode() to get a PHP array then foreach() loop over it to build the html table — fullybaked, Apr 26 '13 at 09:17
i am not at all good in php that is the reason i am using javascript — user2322631, Apr 26 '13 at 09:18
Each category has different number of fields. Do you want to display all row in just one table? — Hieu Le, Apr 26 '13 at 09:25
never use `document.write`. [Why is document.write considered a 'bad practice'?](http://stackoverflow.com/a/802943/632173) — Sandeep, Apr 26 '13 at 09:26

score 0 · Answer 1 · answered Apr 26 '13 at 09:22

Try this:

 for (var i = 0; i < jsonData.account_detail.length; i++) {
var counter = jsonData.account_detail[i];
//console.log(counter.counter_name);
//alert(counter.type);
var tbl_str = '<table border="0" width="500><tr>';
    if(counter.type=="0")
    {
      tbl_str += "<td>"+counter.building_name+"</td>";
      tbl_str += "<td>"+counter.org_name+"</td>";
      tbl_str += "<td>"+counter.user_name+"</td>";
      tbl_str += "<td>"+counter.name+"</td>";
      tbl_str += "<td>"+counter.loc_name+"</td>";
      tbl_str += "<td>"+counter.email_id+"</td>";
      tbl_str += "<td>"+counter.password+"</td>";
    }
    else if(counter.type=="1")
    {
        tbl_str += "<td>"+counter.user_name+"</td>";
        tbl_str += "<td>"+counter.name+"</td>";
        tbl_str += "<td>"+counter.password+"</td>";
        tbl_str += "<td>"+counter.email_id+"</td>";
    }
    else if(counter.type=="2")
    {
            tbl_str += "<td>"+counter.building_name+"</td>";
            tbl_str += "<td>"+counter.org_name+"</td>";
            tbl_str += "<td>"+counter.user_name+"</td>";
            tbl_str += "<td>"+counter.opr_code+"</td>";
            tbl_str += "<td>"+counter.name+"</td>";
            tbl_str += "<td>"+counter.loc_name+"</td>";
            tbl_str += "<td>"+counter.email_id+"</td>";
            tbl_str += "<td>"+counter.password+"</td>";
     }
     else {
               tbl_str += "<td>"+counter.building_name+"</td>";
               tbl_str += "<td>"+counter.org_name+"</td>";
               tbl_str += "<td>"+counter.machine_type+"</td>";
               tbl_str += "<td>"+counter.activate_status+"</td>";
               tbl_str += "<td>"+counter.machine_name+"</td>";
               tbl_str += "<td>"+counter.entrance_exit_name+"</td>";
               tbl_str += "<td>"+counter.entrance_or_exit+"</td>";
               tbl_str += "<td>"+counter.loc_name+"</td>";
               tbl_str += "<td>"+counter.activation_code+"</td>";
            }    
tbl_str += "</tr></table>";    
document.write(tbl_str);    
}

The number of `td` elements in each row does not equal each other. — Hieu Le, Apr 26 '13 at 09:23
no luck ,now the parsed results are also not appearing .thank you for giving a try — user2322631, Apr 26 '13 at 09:32
Try to debug and don't use document.write ... you can use innerHTML if don't have Jquery other wise use html() function .. — Pankaj Dadure, Apr 26 '13 at 09:48

insert the json parsed values into tables

1 Answers1