下拉填充ajax

我有以下问题：当我从下拉列表中选择一个元素时，我想通过ajax自动填充另一个下拉列表。这个想法是在选择“类型”后，子类别（sub_type）不会加载。下拉填充ajax

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'}]

但subcathegory（secont选择）isn`t加载。

来源

2011-08-17 ka_lin

目前尚不清楚你有什么问题。你能重申你的问题吗？ –

编辑我的声明 –

假设阿贾克斯成功函数确实叫，改变功能代码：

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

你的主要问题目前是：

html函数仅被调用一次，因为它不在成功函数中。
在阿贾克斯的数据元素都具有按键ID和名而不是optionValue和optionDisplay

更新：

返回JSON是无效的。字符串必须用双引号括起来，而不是单引号。结果，getJSON()调用失败。

来源

2011-08-17 10:35:50 Codo

下面是正确的吗？因为它没有任何功能$（“＃type”）。change（function（）{.getJSON（“ajax/add_subcathegory.php”，{id：$（this）.val（），ajax：'true '}，函数（J）{ \t \t变量$子类型= $（ “＃sub_type”）; $ 。每个（J，函数（）{$ subType.append（$（' “）.attr（ “value”，this.id）.text（this.name））; }）; }）; }）; –

当你说“它不工作”，我想你的意思是没有任何反应。请尝试调试失败的地方，以便我们能够更好地帮助您。查看Firefox的Javascript控制台（或浏览器中的等效控制台），查看是否发生Javascript错误。如果没有，请使用Firebug，Fiddler或类似的工具来查看网络请求并显示为Ajax请求和Ajax响应。借助Firebug，您还可以在成功功能中设置断点，以查看它是否被调用。 – Codo

我正在使用chrome，因此我可以看到ajax响应，并且在运行修改的脚本时没有错误 –

问题是，您正在将ajax JSON调用之后的html分配给#sub_type。你应该给它分配在Ajax回调函数是这样的：

$("#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); 
    });  
});

来源

2011-08-17 10:35:48

不工作：|。 ajax响应中的空格是否会计数？ –

你确定#sub_type是可见的吗？尝试调用$（'＃sub_type'）。html（''）;在ajax回调之外查看它是否工作（甚至在onchange函数之外）。 –

谢谢，解决问题 –

下拉填充ajax

回答

相关问题