从$ .each json生成选择菜单

时间:2014-02-13 21:57:53

标签: jquery json

我有以下代码,不明白为什么它不起作用或我怎么能让它工作。 我输出的唯一东西是第一个json,所以在这个特定的:

<div id="parents">
<form id="Attr">

<label class="select" for="Memory">Memory</label>
<select name="Memory" id="4"></select>

<label class="select" for="Model">Model</label>
<select name="Model" id="3"></select>

</form>
</div>

由此功能生成:

function renderAttrOptionsName(jsonData,prodID) {
    var  Attr_str = '<form id="Attr">';

    $.each(jsonData, function(index, options){
        Attr_str += '<label class="select" for="'+options.products_options_name+'">'+options.products_options_name+'</label>';
        Attr_str += '<select name="'+options.products_options_name+'" id="'+options.products_options_id+'">';

        var User = new Object();
        User.id = prodID;
        User.oid = options.products_options_id
        var userJson = JSON.stringify(User);
        $('#indicator').show();

        $.post('Controller.php',
               {
                   action: 'get_attributes_options_value',
                   user: userJson       
               },
               function(data, textStatus) {
                   $.each(data, function(index, test){
                       if (test.options_values_price == 0){
                           $( "select" ).add('<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ '</option>');
                           //Attr_str += '<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ '</option>'; 
                       }else{
                           $( "select" ).add('<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ ' (' +test.price_prefix+ ' ' +test.options_values_price+ ')</option>');
                           //Attr_str += '<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ ' (' +test.price_prefix+ ' ' +test.options_values_price+ ')</option>';
                       }
                   });
                   $('#indicator').hide();
               }, 
               "json"       
              ); 
        Attr_str += '</select>';
    });

    Attr_str += '</form">';
    $('div#parents').html(Attr_str);

}

console.log显示所有好处。 如果我在每个$ .each中发出警报,则所有数据都可用。 我假设DOM无法生成第二个Json数据。

1 个答案:

答案 0 :(得分:1)

使用.append,而不是.add

var selectID = options.products_options_id;

   $.each(data, function(index, test){
       if (test.options_values_price == 0){
           $( "select#"+selectID ).append('<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ '</option>');
           //Attr_str += '<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ '</option>'; 
       }else{
           $( "select#"+selectID ).append('<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ ' (' +test.price_prefix+ ' ' +test.options_values_price+ ')</option>');
           //Attr_str += '<option value="' +test.products_options_values_id+ '">' +test.products_options_values_name+ ' (' +test.price_prefix+ ' ' +test.options_values_price+ ')</option>';
       }
   });

.add()用于向jQuery集合添加元素,而不是添加到DOM。