从 JSON 数据创建带有左侧和顶部标题的表格

Question

我有一个 JSON，我需要从中提取标题和数据，而不是包含顶部和左侧标题的 html 表。我已经提供了表数据应该呈现的内容的 sn-p。任何人都可以帮助分解foreach的逻辑以便能够正确显示html。

$json ='{
    "jform": {
    "product": ["3", "4"],
    "type": "101"
    },
    "mainheading": "TYPICAL ANALYSIS",
    "heading1": "NatraMin Original",
    "heading2": "NatraMin Cal-S",
    "heading3": "NatraMin Cal-K",
    "heading4": "",
    "heading5": "",
    "heading6": "",
    "heading7": "",
    "heading8": "",
    "maindata": ["Calcium", "Phosphorus"],
    "data1": ["c12%", "p12%"],
    "data2": ["c13%", "p13%"],
    "data3": ["c14%", "p14%"],
    "data4": ["", ""],
    "data5": ["", ""],
    "data6": ["", ""],
    "data7": ["", ""],
    "data8": ["", ""],
    "itemid": "2"
}';

$tableData = json_decode($json);

foreach ($tableData as $key => $value) {


    echo $key.':'.$value.'<br/>';   

}

下面的 sn-p 只是用于在其下方创建示例表屏幕抓图的 html。我需要以某种方式将该 html 的部分合并到 foreach 中。我尝试嵌套 teh foreach 但只是把它搞砸了，因此我删除了我的尝试并尽可能干净地提供代码。

 echo '        
    <style> 

    table {} 
    table td.top { padding: 10px; background-color: red;color: white}
    table th.top { padding: 10px; background-color: blue; color: white}
    table th.side { padding: 10px; background-color: green; color: white}
    table td { padding: 10px;  border-bottom:1px solid #ededed; text-align:center;}

    </style>

    <table class="table">
        <tbody>
            <tr>
              <th class="top" >TYPICAL ANALYSIS</th>
                <td  class="top" >NatraMin Original</td>
                <td  class="top" >NatraMin Cal-S</td>
                <td  class="top" >NatraMin Cal-K</td>
            </tr>
            <tr>
              <th class="side" >Calcium</th>
                <td>c12%</td>
                <td>c13%</td>
                <td>c14%</td>
            </tr>
            <tr>
              <th class="side" >Phosphorus</th>
                <td>p12%</td>
                <td>p13%</td>
                <td>p14%</td>
            </tr>

        </tbody>
    </table>';

当我在 phptester.net 上运行最上面的代码 sn-p 时，我得到以下输出，我不太担心空值我只需要确保包含数据的值与表正确匹配。

Error Object of class stdClass could not be converted to string on line number 33
jform:
mainheading:TYPICAL ANALYSIS
heading1:NatraMin Original
heading2:NatraMin Cal-S
heading3:NatraMin Cal-K
heading4:
heading5:
heading6:
heading7:
heading8:
maindata:Array
data1:Array
data2:Array
data3:Array
data4:Array
data5:Array
data6:Array
data7:Array
data8:Array
itemid:2

在此先感谢 :) 约翰

Answer 1

这就是你要找的东西：

$tableData = json_decode($json, true);
$mainheading = $tableData['mainheading'];
$HTML_table = "<table>";
// headers
$HTML_table .= "<tr>";
$HTML_table .= "<th class='top1'>$mainheading</th>";
for($i=1; $i<=8; $i++) {
    $d = $tableData["heading$i"];
    if(!empty($d))
        $HTML_table .= "<th class='top2'>$d</th>";
}
$HTML_table .= "</tr>";
// end of headings

// main data
$mainData = $tableData['maindata'];
$mainDataCount = count($mainData);
for($i=0; $i<$mainDataCount; $i++) {
    $d = $mainData[$i];
    $HTML_table .= "<tr>";
    $HTML_table .= "<td class='side'>$d</td>";
    for($j=1; $j<=8; $j++) {
        $d = $tableData["data$j"][$i];
        if(!empty($d))
            $HTML_table .= "<td>$d</td>";
    }
    $HTML_table .= "</tr>";
}
$HTML_table .= "</table>";
?>

在 HTML 中，<th> 在概念上用于标题单元格，而不是一行的起始单元格，所以我还在代码中更改了它们，当然还有 <style>：

<style>
    table {} 
    table th.top1 { padding: 10px; background-color: red;color: white}
    table th.top2 { padding: 10px; background-color: blue; color: white}
    table td.side { padding: 10px; background-color: green; color: white}
    table td { padding: 10px;  border-bottom:1px solid #ededed; text-align:center;}
</style>

要打印结果，只需在您想要的任何地方执行echo $HTML_table; :)