如何根据我的代码和 JSON 响应对象显示下拉菜单列表？

Posted 2023-02-24

【中文标题】如何根据我的代码和 JSON 响应对象显示下拉菜单列表？

【英文标题】：How I can display dropdown menu list based on my code and JSON response object?

【发布时间】：2020-12-19 03:23:52

【问题描述】：

我正在尝试显示基于 JSON 响应对象的下拉列表，如何为以下代码设置它？ 在html中

<select class="form-control" name="productCategories[]" id="productCategories<?php echo $x; ?>" onchange="getProductData(<?php echo $x; ?>)" >
                                
</select>

在javascript中

$.ajax(
                url: 'php_action/fetchDropdownProductData.php',
                type: 'post',
                data: brandId : brandId,
                dataType: 'json',
                success:function(response)  
                    
            var html = '<option value="">Select Sub Category</option>';
            html += response;
            $("#productCategories"+row).html(html);
                    
                    
                 // /success
            );

日志响应看起来像

[“categories_id”:“1”,“categories_name”:“Monitor”,“categories_id”:“3”,“categories_name”:“Scanner”]

【问题讨论】：

“日志响应看起来像” ....这不是 json

[“categories_id”:“1”,“categories_name”:“监视器”,“categories_id”:“3”,“categories_name”:“扫描仪”]

编辑问题以更新该数据，而不是将其放在评论块中。还向我们展示您尝试过的没有按预期工作的方法

【参考方案1】：

你的 json 是一个类别对象的数组，你必须遍历你的 json 来创建选项元素列表，你的成功函数应该是这样的：

success: function (response) 
   var html = '<option value="">Select Sub Category</option>';
   response.forEach(category => 
       html += "<option value='" + category.categories_id + "'>"+ category.categories_name +"</option>"
       $("#productCategories"+row).html(html);
   )