Question

实际上我在主要类别下有主要类别我有产品清单。对于第一个主要类别，我有子类别和子类别相关的产品。无论哪个主要类别没有子类别我都使用逗号分隔符拆分数组并将该产品附加到选择下拉列表。但是，如果主要类别具有子类别意味着我需要使用选项进行optgroup。在optgroup子目录及相关产品中。例如，subcatname1 =＆gt; p1，p2，p3，subcatname2 =＆gt; P1，P2，P3。我们如何解决这个问题请帮助别人。

下面是HTML，

<select name="category" id="category" /> 
   <option selected ="selected">Select category</option>

   <?php foreach($decode as $key => $value) { ?>

          <option value="<?php echo $value['category_id']; ?>"><?php echo $value['name']; ?></option>


          <?php } ?>

 </select>
<select name="category12" class="category12" /></select>

以下是Jquery，

$(document).ready(function(){
        $('#category').change(function(){
        var category_id=$('#category').val();
          $.ajax({
          type: "get",
          url: 'data_product.php?category_id='+category_id,
          success: function(data) {
          var products = data.split(",");
          state_html = '';
          state_html = '<option>Please Select product</option>'
          $.each(products, function (index, productName) {
                 state_html += "<option value='"+productName+"'>"+productName+"</option>";

                 //var gain=
                });
                $('.category12').html(state_html);
            },
        $.each(data, function (index, sub_cat_name) {
                 state_html += "<optgroup label='"+sub_cat_name+"'>"+sub_cat_name+"
                    <option value="+products_name+">"+products_name+"</option>
                 </optgroup>";

                 //var gain=
                });
                $('.category12').html(state_html);
            },

        });
    })
});

Answer 1

您应该只对data进行一次迭代，然后将productnames与其分开。

尝试以下代码，

$(document).ready(function() {
  $('#category').change(function() {
    var category_id = this.value; // use simply this.value here
    $.ajax({
      type: "get",
      url: 'data_product.php?category_id=' + category_id,
      dataType:'json',
      success: function(data) {
        state_html = '<option>Please Select product</option>'
        $.each(data, function(sub_cat_name, product) {
          // split all products here
          var products = product.split(",");
          make optgroup from sub_cat_name key
          state_html += "<optgroup label='" + sub_cat_name + "'>" + sub_cat_name;
          // loop for all product options
          for (var i = , l = products.length; i < l; i++) {
            state_html += "<option value='" + products[i] + "'>" + products[i] + "</option>";
          }
          state_html += "</optgroup>"; // close optgroup here
        });
        // finally append all options
        $('.category12').html(state_html);
      }
    });
  })
});

jquery中的Optgroup问题

1 个答案: