[英]In Cascading dropdown fails but first works fine using jquery Ajax
I have a dropdown that lists the data fetched from database using PHP and jQuery Ajax
. 我有一个下拉列表,列出了使用PHP and jQuery Ajax
从数据库中获取的数据。
HTML for first dropdownlist : 第一个下拉列表的HTML:
$(document).ready(function () {
$(function() {
$.ajax({
type: 'POST',
url: 'getGroupzBase.php',
datatype: 'json',
success: function(data) {
// Call this function on success
console.log(data);
var yourArray = JSON.parse(data);
console.log(yourArray);
$.each(yourArray, function (index, yourArray) {
$('#builder_group').append($('<option/>', {
value: yourArray.id,
text : yourArray.name,
}));
});
},
error: function() {
displayDialogBox('Error', err.toString());
}
});
});
And the dropdown tag - 还有下拉标签-
<select id="builder_group"></select>
For the second dropdown menu does not work with the first dropdown. 对于第二个下拉菜单,不适用于第一个下拉菜单。 I have to use jQuery Ajax for the second dropdown as well. 我还必须在第二个下拉菜单中使用jQuery Ajax。
HTML for second dropdownlist : 第二个下拉列表的HTML:
<script> $("#builder_group").change(function(){ console.log("Hello 1"); $('#Ivrmapping_groupZCode').find('option').remove().end(); //clear the city ddl var builder = $(this).find("option:selected").text(); alert(builder); //do the ajax call $.ajax({ url:'getGroupzCode.php' type:'GET', data:{city:builder}, dataType:'json', cache:false, success: function(data) { // Call this function on success console.log(data); var yourArray = JSON.parse(data); console.log(yourArray); $.each(yourArray, function (index, yourArray) { ); }); }, error: function() { displayDialogBox('Error', err.toString()); } }); }); }); </script>
And the dropdown tag - 还有下拉标签-
<select name="Ivrmapping[groupZCode]" id="Ivrmapping_groupZCode">..
</select>
Why is the second dropdownlist not working with first. 为什么第二个下拉列表不能与第一个一起使用。 Can we have more than one jQuery Ajax calls in one page. 我们可以在一个页面中有多个jQuery Ajax调用吗?
I think there is problem of brackets:: Try this: 我认为存在方括号问题::尝试以下操作:
$("#builder_group").change(function(){
console.log("Hello 1");
$('#Ivrmapping_groupZCode').find('option').remove().end(); //clear the city ddl
var builder = $(this).find("option:selected").text();
alert(builder);
//do the ajax call
$.ajax({
url:'getGroupzCode.php'
type:'GET',
data:{city:builder},
dataType:'json',
cache:false,
success: function(data) {
// Call this function on success
console.log(data);
var yourArray = JSON.parse(data);
console.log(yourArray);
$.each(yourArray, function (index, yourArray) {/* your plan*/});
},
error: function() {
displayDialogBox('Error', err.toString());
}
});
});
And you should use firebug, or chrome, these errors are clearly shown on the console. 而且您应该使用Firebug或Chrome,这些错误会在控制台上清楚显示。 Try it out. 试试看。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.