php - JSON:使用Javascript> jsfiddle示例无法编码，解析，呈现表

我有一个jsfiddle here，用于使我的概念正常工作。

我遇到的问题很可能是由JSON引起的，我将分享用于生成该问题的代码。

首先我做一个查询：

$sth->execute();

$last_sup   = 0;
$i          = 0;
$reorderArr = array();
$prodsArr   = array();
$si         = 0;

while ($row = $sth->fetchObject()) {

    // If new supplier.
    if ($last_sup !== $row->sup_id) {

        $last_sup = $row->sup_id;

        // If not first iteration.
        if ($i !== 0) {

            // Append $prodsArr to current $supArr
            $supArr['prods'] = (array)$prodsArr;

            // empty $prodsArr ready for next sup.
            $prodsArr = array();

            // Append $supArr to previous $reorderArr
            $reorderArr[$si] = (array)$supArr;

            $si++;
        }

        // Create entries for new supplier to $supArr
        $supArr = array(
            "supID"                 => $row->sup_id,
            "supName"               => $row->supplier_comp_name
        );
    }

    // Build array of products for this supplier.
    $prodsArr[] = array(
        "pID"                   => $row->prod_id,
        "sku"                   => $row->sku,
        "pName"                 => $row->prod_name,
        "cat"                   => $row->category_name,
        "desc"                  => $row->prod_desc,
        "stock_level"           => $row->stock_level,
        "reOrdLev"              => $row->reorder_level,
        "reOrdQty"              => $row->reorder_qty,
        "vat_exempt"            => $row->vat_exempt,
        "lastorderdate"         => $row->lastorderdate,
        "lastorderqty"          => $row->lastorderqty,
        "qty_in_outer"          => $row->qty_in_outer,
        "cost_per_outer"        => $row->cost_per_outer
    );

    $i++;

}

// Process the very last loop (since it's normally processed
// at the start of the next loop.

// Append $prodsArr to current $supArr
$supArr[] = (array)$prodsArr;

// Append $supArr to previous $reorderArr
$reorderArr[$si] = (array)$supArr;


return $reorderArr;

然后我将其json_encode翻倍（因为我遵循的教程告诉我这样做），并使用Jquery对其进行解析，如下所示：

var data = $.parseJSON(<? print json_encode(json_encode($reorderArr));?>);

并且我在页面上的脚本标签之间插入了上面的行，并使用下面的行将其发送到函数中进行处理：

displayReorderList(data);

这是当前状态下的displayReorderList()函数：

function displayReorderList($data) {

    var table = document.createElement('table');

    /**
     * Set up supplier group.
     * 1 loop per group.
     */
    for(var i=0; i < data.length; i++) {

        var tr = document.createElement('tr');
        var td1 = document.createElement('td');

        // Need to put the Supplier name here in a colspan cell.
        var text1 = document.createTextNode(data[i].supName);
        td1.appendChild(text1);
        tr.appendChild(td1);
        table.appendChild(tr);

        /**
         * Setup Product Group.
         * 1 loop per product.
         */
        for(var j = 0; j < data[i].prods.length; j++) {

            var tr = document.createElement('tr');
            var td1 = document.createElement('td');

            var text1 = document.createTextNode(data[i].prods[j].sku);
            td1.appendChild(text1);
            tr.appendChild(td1);
            table.appendChild(tr);

        }
    }
    document.body.appendChild(table);

为了使数据结构更简单，这里是一个print_r($reorderArr)

我试图以供应商分组的清单来达到已达到其重新订购水平的产品清单，但是脚本似乎停滞在for(var j = 0; j < data[i].prods.length; j++) {处，但仅在经过该行几次之后才停止。似乎错误地报告了data[i].prods的长度，可能是因为JSON格式错误？

请参阅jsfiddle。

更新
@Yogesh向我指出正确的方向后，我进行了如下更新。

我已在服务器端数组构造中将$supArr[] = (array)$prodsArr;更改为$supArr[prods] = (array)$prodsArr;。

这样做之后，一切都很好。有关正确生成的数据，请参见jsfiddle here。

最佳答案

您数组的第三个元素不包含prods数组，请参见此处

[2] => Array
    (
        [supID] => 12
        [supName] => Trade Plumbing Supplies Inc.
        [0] => Array
         ^// its 0 not prods

[1] => Array
    (
        [supID] => 9
        [supName] => Prime Plumbing Inc.
        [prods] => Array
           ^// its prods

因此，data [i] .prods的长度被错误地报告了。

您在这里有if条件，因为prods不适用于所有数组

if ($i !== 0) {

        // Append $prodsArr to current $supArr
        $supArr['prods'] = (array)$prodsArr;