php - 根据 JSON 数据创建包含左侧和顶部标题的表格

标签 php mysql arrays json foreach

我有一个 JSON,我需要将标题和数据提取到包含顶部和左侧标题的 html 表中。我提供了表数据应呈现的内容的片段。任何人都可以帮助分解 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/>';   

}

下面的代码片段只是我用来在其下面创建示例表屏幕截图的 html。我需要以某种方式将该 html 的部分合并到 foreach 中。我尝试嵌套 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>';

enter image description here

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

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

提前致谢:) 约翰

最佳答案

这是您要寻找的内容:

$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;任何你想去的地方:)

关于php - 根据 JSON 数据创建包含左侧和顶部标题的表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30282764/

相关文章:

php - 使用开始时间和结束时间之间的时间过滤数组或 XML

php - 谷歌地图 v3.0 未加载

javascript - 如何使用ajax将jquery变量值传递给php变量?

php - 找到数字数组中的空白并填补空白 - 循环

php - MySQL:从表中获取最后更新ID以将其插入到另一个表中

php - 如何以编程方式添加商店积分以进行 Magento 订单?

MySQL服务器不会将更新值放入 ' and '中,因此它认为该值是一列

javascript - 将具有重复值的字符串数组转换为基于索引的对象数组

ios - CollectionView多单元格选择

java - 如何使用Java将数据从一个ArrayList添加到另一个ArrayList?