JSON извлечение и установка значения в поле выбора на основе данных в JSON

Question

У меня есть json данные из базы данных, и я хочу установить в раскрывающемся списке «Выбор» данные, которые я получаю на JSON. Вот мои коды ниже.

Jquery

var objJSON = JSON.parse(response['data'][0].certificate);
var inputs = "";
$.each(objJSON, function (i, v) {
    inputs += '<select class="form- " name="department[]"><option>選択してください</option><option>department one</option><option>industry two</option><option>industry three</option> <option>industry four</option></select>';
});
$("#input_container").html(inputs);

HTML

<div id="input_container"></div>

Ниже мой console.log вывод для моего json.

И я хочу иметь вывод, как показано ниже.

Можете ли вы помочь мне с этими парнями? спасибо.

Answer 1

зачем создавать отдельные для каждой опции?

почему бы не генерировать only?

var objJSON = ['industry one', 'second industry', 'third ...']; //JSON.parse(response['data'][0].certificate);


setTimeout(function(){ // timeout for DEMO only

  $('#DepartmentsDropDownList').empty();

  
  //if(isOptional || notRequiredInput)
  //  $('#DepartmentsDropDownList').append('<option value=""> -- Select an item</option>');
  
  for(var i in objJSON) {
      $('#DepartmentsDropDownList').append('<option value="'+ objJSON[i] +'">'+ objJSON[i] +'</option>');
  }

}, 1000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="input_container">
  
  <select id="DepartmentsDropDownList" class="form-control" name="department[]">
    <option> -- Loading items...</option>
  </select>

</div>

---

Если вы хотите отдельно выбрать для каждого элемента

var objJSON = ['industry one', 'second industry', 'third ...']; //JSON.parse(response['data'][0].certificate);


setTimeout(function(){ // timeout for DEMO only

  $('#inputs_container').empty();

  
  //if(isOptional || notRequiredInput)
  //  $('#DepartmentsDropDownList').append('<option value=""> -- Select an item</option>');
  
  for(var i in objJSON) {
      $('#inputs_container').append('<div> <select><option value="'+ objJSON[i] +'">'+ objJSON[i] +'</option></select> </div>');
  }

}, 1000);

<div id="inputs_container"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

---

Выбранные сертификаты Решение

---

var objJSON = ['certification one', 'certification two', 'certification five']; //JSON.parse(response['data'][0].certificate);
      $('#DepartmentsDropDownList').val(objJSON);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="input_container">
  
  <select id="DepartmentsDropDownList" class="form-control" name="department[]" multiple="multiple" style="height: 100px;">
    <option value="certification one">certification one</option>
    <option value="certification two">certification two</option>
    <option value="certification three">certification three</option>
    <option value="certification four">certification four</option>
    <option value="certification five">certification five</option>
  </select>

</div>