遍歷json_encode的輸出

Question

我正在嘗試使此解決方案起作用： https : //stackoverflow.com/a/30400111/4532066

我有一個簡單的SELECT菜單：

<select class='form-control' id='builders' name='builder_id'>
    <option value="1">Oracle</option>
    <option value="2">SQL</option>
</select>

我想使用第一個SELECT的ID來更改第二個SELECT的ID為“ regions”的內容

這是我正在使用的jQuery代碼：

$(document).ready(function() {
  $('#builders').change(function() {
    var currentValue = $(this).val();
    $.get("ajax_cats.php", {
      'builder_id': currentValue
    }, function(data) {
      var regions = $.parseJSON(data);
      $('#regions').empty();
      for (var i = 0; i < regions.length; i++) {
        var regionOption = '<option value="' + regions[i]['fld_label'] + '">';
        regionOption += regions[i]['fld_label'];
        regionOption += '</option>';
        $('#regions').append(regionOption);
      }
    });
  });
});

這是“ ajax_cats.php”的內容

 $sql = "SELECT cats.fld_label
           FROM tbl_b_cats cats
          WHERE cats.fld_parent = ? 
       ORDER BY cats.fld_label";

/* initialise */
$stmt = $conn->stmt_init();

/* prepare */
if (!$stmt->prepare($sql)) {
    throw new Exception("Error preparing statement: $stmt->error, SQL query: $sql");
}

/* bind */
if (!$stmt->bind_param('s', $_GET['builder_id'])) {
    throw new Exception("Error binding parameter: $stmt->error");
}

/* execute & store */
$stmt->execute();
$stmt->store_result();

/* 404 for no results */
if ($stmt->num_rows == 0) {
    header('HTTP/1.0 404 Not Found');
    exit;
} else {

    $regions = array();

    /* get results */
    $stmt->bind_result($fld_label);

    while ($stmt->fetch()) {
        $regions['fld_label'][]   = $fld_label;
    }

    //print_r(array_values($regions));
    //$bob = json_encode($regions);
    //r($bob);
    echo json_encode($regions);

}
/* free and close */
$stmt->free_result();
$stmt->close();

$conn -> close();

我已經確認“ ajax_cats.php”返回的數據為JSON格式-例如

{
    "fld_label": ["AP", "AR", "EAM", "GL", "HR", "INV", "Other", "PA", "PO", "SysAdmin"]
}

我認為問題出在jQuery的以下部分：

var regions = $.parseJSON(data);
$('#regions').empty();
for (var i = 0; i < regions.length; i++) {
    var regionOption = '<option value="'+regions[i]['fld_label']+'">';
    regionOption += regions[i]['fld_label'];
    regionOption += '</option>';
    $('#regions').append(regionOption);
}

從昨天的S / Overflow閱讀中，“ length”選項僅在使用數組時有效。

因為如果我這樣做：

console.log(regions.length);

它返回“未定義”

我想知道如何解決這個問題？

謝謝

Answer 1

查找JSON長度的正確方法是使用類似以下的鍵：

var length = regions.fld_label.length;

這將為您提供JSON密鑰值的長度，使用它您可以循環到JSON中特定密鑰的值。

這樣說，希望您不會收到該錯誤

var regionOption = '<option value="'+regions.fld_label[i]+'">';

Answer 2

需要進行一些調整：

1. 更改var regions = $.parseJSON(data); 到var regions = $.parseJSON(data).fld_label; 。 這將為您提供區域陣列。
2. 然后將regions[i]["fld_label"]更改為regions[i]

代碼段：

 var data = "{ \\"fld_label\\": [\\"AP\\", \\"AR\\", \\"EAM\\", \\"GL\\", \\"HR\\", \\"INV\\", \\"Other\\", \\"PA\\", \\"PO\\", \\"SysAdmin\\"]}"; var regions = $.parseJSON(data).fld_label; // To get the array ["AP", "AR, ...] $('#regions').empty(); for (var i = 0; i < regions.length; i++) { var regionOption = '<option value="' + regions[i] + '">'; regionOption += regions[i]; regionOption += '</option>'; $('#regions').append(regionOption); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="regions"></select>