Question

一旦dropdown1中的选定值发生变化，我就需要填充dropdown1所选值的相应数据。填充的数据必须附加到dropdown2。

我检查了相关的答案和问题，并尝试了几乎所有可能的解决方案，但我仍然无法让它发挥作用。

HTML

<body>
<select id="dropdown1" class='form-control-static'>
    <option value="value1">Value 1</option>
    <option value="value2">Value 2</option>
</select>

<select id="dropdown2" class='form-control-static'>
</select>

<script src="js/jquery.js"></script>
<script src="js/externalJavascript.js"></script>
</body>

externalJavascript

$('select[name=dropdown1]').change(function (e) {
        var selected = $('select[name=dropdown1]').val() 
        alert(selected);

        $.ajax({
            type: 'POST',
            data: { name: selected },
            url: 'dbaccess.php',
            datatype: 'json',
            success: function(data) {
                alert(data);
                var $select = $('#dropdown2');
                $.each(data, function(key, value) {
                    $select.append('<option value=' + key + '>' + value.name + '</option>');
                });
            }
        });
    });

dbaccess.php

<?php
$name = $_POST['name'];
$name_id = getIdByName($name);

$names_arr = array();
$names_arr = getNamesByNameId($name_id);
//var_dump($names_arr);
echo json_encode($names_arr);
?>

消息警告框将返回正确的数据，如SQL编辑器中所示 alert(data)将数据库中返回的数据显示为

[{"name":"My Name 1"},{"name":"My Name 2"},{"name":"My Name 3"}]

但无论我做什么，它都不会附加到dropdown2选择。我发现ajax没有任何问题。

任何想法或想法？我会感激任何帮助或建议。

谢谢。

Answer 1

您的整个代码完美缺少一行。

只需在ajax成功通话中添加 JSON.parse 功能。

success: function(data) {
                data = JSON.parse(data);
                .........
            }

Ajax数组不会在下拉选择中填充

1 个答案: