2016-04-21 2 views
0

Я использую плагин this, чтобы создать DualListBox для поля выбора для формы в twitter-bootstrap-3. Форма создается для целей издания. Поэтому я пытаюсь добавить ранее выбранные значения в правой части окна. А также не выбранные значения добавляются вручную.Заполнение выбранных элементов в правом поле DualListBox

Для этого я собрал данные из JSON и создаю строку параметров вручную. Вот мой код -

// Getting data related to the country of operations 
    $.getJSON(country_of_operation_json_url) 
     .done(function (data) { 
      var options = ''; 

      for (var i = 0; i < data.length; i++) { 
       var a = 1; 
       for (var j = 0; j < port_ids.length; j++) { 
        // Appending "selected" attribute to the values which are already selected 
        if (port_ids[j] == data[i]["id"]) { 
         options += '<options value="' + data[i]["id"] + '" selected="selected">' + data[i]["port_iso"] + '</options>'; 
         a = 0; 
        } 
       } 
       if (a == 1) { 
        options += '<options value="' + data[i]["id"] + '">' + data[i]["port_iso"] + '</options>'; 
       } 
      } 

      // Appending the options at the selected box of the dual box 
      $("select#country-of-operation-edit").empty().append(options); 

      // Loading Country of operating dual-box field 
      $("#country-of-operation-edit").DualListBox(); 

     }); 

Вот HTML-файл, который генерирует поле выбора -

<div class="form-group row"> 
        <label class="col-sm-2 form-control-label">Country of operation</label> 
        <div class="col-sm-10"> 
         <select class="form-control" multiple="multiple" data-json="false" id="country-of-operation-edit"> 
         </select> 
        </div> 
       </div> 

проблема есть, нет значения, показывающего в поле. Вот скриншот -

enter image description here

Я не мог найти то, что я делаю неправильно здесь. Если это не способ заполнения значений DoubleListbox, каковы другие способы? Любая помощь будет очень признательна. Я застрял здесь часами.

EDIT-1: Вот мой JSON - http://codebeautify.org/jsonviewer/cb7e1573

EDIT-2: Для проверки, вы можете принять эти значения, как выбрано -

port_ids = ["41", " 47", " 61"] 
+0

Вам действительно нужен ajax для получения значений? – madalinivascu

+0

Да. Мне нужно принимать значения из внешнего источника и фильтровать некоторые из них как «выбранные». – ni8mr

+0

Как насчет ошибок? – madalinivascu

ответ

1

Изменение options для option человек:)

for (var i = 0; i < data.length; i++) { 
       var a = 1; 
       for (var j = 0; j < port_ids.length; j++) { 
        // Appending "selected" attribute to the values which are already selected 
        if (port_ids[j] == data[i]["id"]) { 
         options += '<option value="' + data[i]["id"] + '" selected="selected">' + data[i]["port_iso"] + '</option>'; 
         a = 0; 
        } 
       } 
       if (a == 1) { 
        options += '<option value="' + data[i]["id"] + '">' + data[i]["port_iso"] + '</option>'; 
       } 
      } 

https://jsfiddle.net/hh2zrt82/

+1

Вау, спасибо. Простая крошечная ошибка может привести к разочарованию. Очень признателен. :) Кстати, я собирался открыть щедрость для этого вопроса. К счастью, моя репутация сохранилась. – ni8mr

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