[英]Codeigniter Ajax Dependent Dropdown doesn't work inside foreach statement
我在同一页面中做了 2 个依赖下拉菜单。 其中之一是在 foreach 语句中,它根本不起作用。 同时另一个运作良好。 id 的名字完全不同。 两个依赖下拉列表都引用了控制器中的相同功能。 我认为这是主要问题并尝试制作不同的功能,但它没有改变任何东西。
看法 :
<tr>
<td><label>Category</label></td>
<td>
<div class="form-group">
<select id="edit_category" class="form-control" name="edit_category">
<option value="">Select Category</option>
<?php foreach ($categories as $cat) : ?>
<option <?php ?> value="<?php echo $cat->id; ?>"><?php echo $cat->name
</option>
<?php endforeach; ?>
</select>
</div>
</td>
</tr>
<tr>
<td><label>Product</label></td>
<td>
<div class="form-group">
<select name="edit_product" id="edit_product" class="form-control" style="width:350px">
<option value="">Select Product</option>
</select>
</div>
</td>
</tr>
脚本 :
<script type="text/javascript">
$(document).ready(function() {
//DEPENDENT DROPDOWN - ADD ITEM :
$('#add_category').on('change', function() {
$('#add_product').html('<option value="">Select Product</option>');
var catID = $(this).val();
$.ajax({
url: "<?php echo site_url('admin/item/dependentDL') ?>",
method: "POST",
data: {
id_p_category: catID
},
async: true,
dataType: "json",
success: function(data) {
$('#add_product').html(data);
},
error: function(error) {
alert(error);
}
});
return false;
}); //END - DROPDOWN - ADD ITEM
//DEPENDENT DROPDOWN - EDIT ITEM :
$('#edit_category').on('change', function() {
$('#edit_product').html('<option value="">Select Product</option>');
var edit_catID = $(this).val();
$.ajax({
url: "<?php echo site_url('admin/item/dependentDL') ?>",
method: "POST",
data: {
id_p_category: edit_catID
},
async: true,
dataType: "json",
success: function(data) {
$('#edit_product').html(data);
},
error: function(error) {
alert(error);
}
});
return false;
});
});
</script>
您应该尝试使用 class 而不是 id 因为 id 是唯一的并且您在 foreach 循环中的下拉列表所以请尝试使用如下所示的类
$('.add_category').on('change', function() {
$('#add_product').html('<option value="">Select Product</option>');
var catID = $(this).val();
$.ajax({
url: "<?php echo site_url('admin/item/dependentDL') ?>",
method: "POST",
data: {
id_p_category: catID
},
async: true,
dataType: "json",
success: function(data) {
$('#add_product').html(data);
},
error: function(error) {
alert(error);
}
});
return false;
}); //END - DROPDOWN - ADD ITEM
//DEPENDENT DROPDOWN - EDIT ITEM :
$('.edit_category').on('change', function() {
$('#edit_product').html('<option value="">Select Product</option>');
var edit_catID = $(this).val();
$.ajax({
url: "<?php echo site_url('admin/item/dependentDL') ?>",
method: "POST",
data: {
id_p_category: edit_catID
},
async: true,
dataType: "json",
success: function(data) {
$('#edit_product').html(data);
},
error: function(error) {
alert(error);
}
});
return false;
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.