2015-06-09 7 views
3

Используя jquery, я пытаюсь заполнить выпадающее меню json. Я пытаюсь вывести список стран из ниже ... JSONPopulate select drop-down с json

{ 
"country":[ 
    { 
    "China":[ 
     { 
      "tarrifType":"Pay as you go" 
     }, 
     { 
      "fixLine":"23p" 
     } 
    ], 
    "India":[ 
     { 
      "sms":"39p" 
     }, 
     { 
      "fixLine":"3p", 
      "sms":"59p" 
     } 
    ], 
    "Poland":[ 
     { 
      "mobile":"29p", 
      "sms":"19p" 
     }, 
     { 
      "tarrifType":"China Pass", 
      "fixLine":"23p" 
     } 
    ] 
    } 
] 
} 

До сих пор JQuery я пытался сделать это с помощью является следующее ...

$.getJSON("js/widgets/country-picker.json", function(result){ 
    $.each(result, function(i, field) { 
    $('#js-rate-select').append($('<option>').text(field[1]).attr('value', field[1])); 
    }); 
}); 

Но это делает не заполнять ниспадающее меню выбора или давать какие-либо ошибки DOM. Любые предложения, как я могу это исправить? Я думаю, проблема связана с json-форматом, который я могу изменить Спасибо

+1

Какая часть JSON вы на самом деле хотите в избранных? Названия стран или одна из частей каждой страны? –

ответ

2

Ваш json-канал возвращает массив, содержащий только один индекс, который является объектом с разными странами. Для этого, вы должны сказать

result.country[0].China.tarrifType. 

И вы могли бы перебирать страны, как это:

$.each(result.country[0], function(country,data) { console.log(country); } 

Хотя, я бы рекомендовал, чтобы повторить JSON. Вы могли бы сделать так:

var result = { 
    "country": { 
     "China": { 
      "tarrifType": "Pay as you go", 
      "fixLine": "23p" 
     }, 
     "India": { 
      "sms": "39p", 
      "fixLine": "3p", 
      "sms": "59p" 
     }, 
     "Poland": { 
      "mobile": "29p", 
      "sms": "19p", 
      "tarrifType": "China Pass", 
      "fixLine": "23p" 
     } 
    } 
}; 


$(function() { 
    $.each(result.country, function (country, data) { 
     console.log("Country : " + country); 
     console.log(data); // data.fixLine, data.tarrifType, data.sms 

     $('#selectbox').append('<option value="' + country + '">' + country + '</option>'); 

    }); 
}); 

jsfiddle здесь: Link to JSfiddle

+1

Большое спасибо за помощь и за то, что нашли время, чтобы сделать скрипку. Я также изменил структуру json, как было предложено и хорошо работает. Очень признателен. –

Смежные вопросы