我有以下问题:当我从下拉列表中选择一个元素时,我想通过ajax自动填充另一个下拉列表。这个想法是选择“类型”后不会加载subcategory(sub_type)。

HTML
<select id="type" name="type">
<option value="1">General</option>
<option value="2">Test</option>
</select>
<select id="sub_type" name="sub_type">
</select>


SCRIPT
    $("#type").change(function(){
    $.getJSON("ajax/add_subcathegory.php",{id: $(this).val(), ajax: 'true'}, function(j){
          var options = '';
          for (var i = 0; i < j.length; i++) {
            options += '<option value="' + j[i].id+ '">' + j[i].name+ '</option>';
          }
        });
    $("#sub_type").html(options);
    });


我的ajax脚本返回:

[{id: 0, name: 'Mark'}, {id:1, name: 'Andy'}, {id:2, name: 'Richard'}]


但是子类(第二选择)没有被加载。

最佳答案

假设确实调用了Ajax成功函数,请将函数代码更改为:

          var $subType = $("#sub_type");
          $subType.empty();
          $.each(j, function () {
            $subType.append($('<option></option>').attr("value", this.id).text(this.name));
          });


您目前的主要问题是:


html函数仅被调用一次,因为它在成功函数之外。
Ajax数据中的元素具有键id和name,而没有optionValue和optionDisplay


更新:

返回的JSON无效。字符串必须用双引号而不是单引号引起来。结果,getJSON()调用将以静默方式失败。

10-07 21:21
查看更多