Программный выбор select2, который извлекает свои данные через Ajax

Question

Я использую select2 version 4.0, и я пытаюсь сделать программный выбор в поле выбора, которое получает свои данные из вызова ajax.

В документации я нашел, как установить значение программным путем на обычный select2, но я не могу понять, как это сделать с помощью выбора ajax.

Если я правильно помню, в старой версии, вы можете установить текущее значение, передавая данные в выбор2 с этой командой:

jQuery("selectbox").select2("data", data) 

Я попытался это, и послал объект данных с , id, текст и результат, но ничего не видно, и когда я запрашиваю статус окна выбора, чтобы увидеть выбранные значения, он возвращает null.

Был ли этот вариант удален или просто изменен? Где я могу найти это в документации или как я могу достичь желаемого поведения?

Answer 1

Единственный способ добиться этого - сначала добавить <option> в select dom с данными, которые вы хотите выбрать, и сразу же выберите его так, как если бы вы делали это с помощью обычного блока выбора. Это был официальный ответ от кевина-коричневого также на странице проекта github.

https://github.com/select2/select2/issues/3273

Итак, basicaly, если вы знаете, что вы хотели бы выбрать, вы можете легко создать <option> элемент из него, добавить его в оригинальной выберите поле, а затем выберите его это значение:

var option=jQuery("<option>").attr("value","your_id_here").html("your_text_here"); 
jQuery("selectbox").append(option); 
jQuery("selectbox").val("your_id_here").trigger("change"); 

Answer 2

Я хотел бы также хотелось знать, полный ответ на этот вопрос, но вот частичное решение:

$('#select2-control-id').val('item-id').trigger('select2:select').trigger('change'); 

Это только кажется, работает, если select2 уже погрузили деталь вы просите - то это который вы уже нажали.

Не только вы должны вручную открыть раскрывающееся меню, чтобы загрузить первую страницу элементов через AJAX - вы также должны иметь на самом деле нажал на тот, который вы хотите программным образом выбрать позже.

Это похоже на то, что он добавляет <options> в базовый элемент select, когда вы на самом деле нажимаете на них.

Я не вижу способа программно сообщить select2, чтобы загрузить первую страницу результатов AJAX.

Answer 3

Вы можете попробовать это.

var dataString = 'id='+$value; 
    var promise = sendAjaxFunction('load_form.php?k=1',dataString); 
    $("#LoadMachine").html("<img src='images/ajax-loader.gif' />"); 
    promise.success(function (data) { 
     $("#LoadMachine").html(data); 
     $("#MachineName").select2({ 
      placeholder: 'Select Operation Name ...', 
      allowClear: true 
     }); 
     return false; 
    }); 

Загрузите данные в Div #LoadMachine и в результате вы можете загрузить select2.

Answer 4

Это легко манипулировать скрытый <select/> поле, как:

//set first option as selected 
$("select [value='0']").attr("selected","selected"); 
$("select").trigger("change"); 

Demo