通过 AJAX 将 php 数组放入下拉框中答案

【问题标题】：php array in to a drop down box via AJAX通过 AJAX 将 php 数组放入下拉框中
【发布时间】：2015-12-28 23:03:02
【问题描述】：

我有几个下拉框。我希望第一个选择类别，然后对 PHP 文件进行 AJAX 调用，该文件选择适当的子类别数组并将其返回到第二个下拉列表。代码如下：

带有子类别的 PHP 文件：

    $category = $_POST['category'];

if ($category == "World"){
$subcategory = array('Europe' => "Europe", 'North America' => "North America", 'South America' => "South America");}
    else if ($category == "Sport"){
$subcategory = array("Football , Football", "Rugby , Rugby", "Cricket , Cricket"); }
echo json_encode($subcategory);

AJAX

function getsub(category, subcategory) {

var category = document.getElementById('category').value;
$('#subcategory').empty();
$('#subcategory').append("<option>loading...</option>");

//kicking off AJAX
$.ajax({
    url: "../php/subcategory.php",
    type: "POST",
    async: true,
    //this is where we define the data that we will send
    data: {
        category: category,
    },
    success: function (subresults) {
        var subresults = JSON.parse(subresults);
        $('#subcategory').empty();
        $('#subcategory').append("<option value='0'>----Select Sub Categry---</option>");
        $.each(subresults, function (i, item) {

            $('#subcategory').append('<option value="' + subresults[i].id + '">' + subresults[i].name + '</option>');

        });
    },
});
return false;
}

我这样做的原因是因为我想将子类别保留在服务器端并且易于更新而无需干预代码。目前，这是将数组中的项目输出到下拉框中，但它们是未定义的。你能帮我把正确的值输出到下拉框吗？

【问题讨论】：

您的 AJAX 调用有效吗？向我们展示一些在您的 AJAX 调用中返回的示例数据（console.log(subresults) 在您在成功函数中解析它们之前）
您是否在 php 代码中使用了echo json_encode($subcategory);？
您的 php 数组中没有 id 和 name 键。你应该改成subresults[i]。
当我控制台日志 {"Europe":"Europe","North America":"North America","South America":"South America"}
刚刚注意到我会删除 echo json_encode($subcategory);关闭 php 代码的底部。

标签： javascript php arrays ajax

【解决方案1】：

有一件事是，如果您的选项的值和标签相同，则不需要使用不必要的键设置带有'Europe' => "Europe" 的数组。像这样设置数组就行了

$subcategory = array("Europe", "North America", "South America");

在你的 JS 中，像这样设置值和标签：

$.each(subresults, function (i, item) {
     $('#subcategory').append('<option value="' + item + '">' + item + '</option>');
});

但是，如果你想像这样保持单独的值和标签：

$subcategory = array('EU' => "Europe", 'NA' => "North America", 'SA' => "South America");

然后像这样设置选项值和标签：

$.each(subresults, function (i, item) {
     $('#subcategory').append('<option value="' + i + '">' + item + '</option>');
});

使用subresults[i] 是不必要的，因为您已经拥有item 的值，相当于subresults[i]。

【讨论】：

【解决方案2】：

在您的 AJAX 中，您调用 subresults[i].id 和 subresults[i].name，因此在定义 PHP 数组时必须使用此结构：

if ($category == "World"){
    $subcategory = array(
        array('id' => "Europe", 'name' => "Europe"),
        array('id' => "North America", 'name' => "North America"),
        array('id' => "South America", 'name' => "South America")
    );}
else if ($category == "Sport"){
    $subcategory = array(
        array('id' => "Football", 'name' => "Football"),
        array('id' => "Rugby", 'name' => "Rugby"),
        array('id' => "Cricket", 'name' => "Cricket")
    ); }
echo json_encode($subcategory);

【讨论】：