Как установить выбранное значение jquery select2?

Это относится к кодам до select2 версии 4

У меня есть простой код select2 которые получают данные из AJAX

$("#programid").select2({
  placeholder: "Select a Program",
  allowClear: true,
  minimumInputLength: 3,
  ajax: {
    url: "ajax.php",
    dataType: 'json',
    quietMillis: 200,
    data: function (term, page) {
      return {
        term: term, //search term
        flag: 'selectprogram',
        page: page // page number
      };
    },
    results: function (data) {
      return {results: data};
    }
  },
  dropdownCssClass: "bigdrop",
  escapeMarkup: function (m) { return m; }
});

Этот код работает, однако мне нужно установить для него значение, как будто в режиме редактирования. Когда пользователь выбирает значение в первый раз, оно будет сохранено, а когда ему нужно отредактировать это значение, оно должно появиться в том же меню выбора (select2), чтобы выбрать ранее выбранное значение, но я не могу найти способ.

ОБНОВИТЬ:

HTML-код:

<input type="hidden" name="programid" id="programid" class="width-500 validate[required]">

Программный доступ Select2 не работает с этим.

36 ответов

$input.val(1).trigger('изменить');

      [jsfiddle_link][1] <select id="lang" multiple >
       <option value="php">php</option>
        <option value="asp">asp</option>
       <option value="java">java</option>
  </select>

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    $("#lang").select2().select2('val',['asp','php']);

<!-- language: lang-html -->


  [1]: https://jsfiddle.net/xrug7f6k/

После получения ответа на ваш запрос вы можете обновитьselect2значение таким образом:

      let response = JSON.parse(your_response);
let key_to_select = response.your_key;

$(document).find('yourIdorClass').val(key_to_select ).trigger("change");

Если вы получаете свои значения из ajax, перед вызовом

$("#select_location_id").val(value);
$("#select_location_id").select2().trigger('change');

подтвердите, что вызов ajax завершен, используя функцию jquery, когда

$.when(ajax1(), ajax2(), ajax3(), ajax4()).done(function(a1, a2, a3, a4){
      // the code here will be executed when all four ajax requests resolve.
      // a1, a2, a3 and a4 are lists of length 3 containing the response text,
      // status, and jqXHR object for each of the four ajax calls respectively.
    }); 
как описано здесь [ Подождите, пока не будут выполнены все запросы jQuery Ajax?

Вы должны использовать:

var autocompleteIds= $("#EventId");
autocompleteIds.empty().append('<option value="Id">Text</option>').val("Id").trigger('change');

// For set multi selected values
var data =  [];//Array Ids
var option =  [];//Array options of Ids above
autocompleteIds.empty().append(option).val(data).trigger('change');

// Callback handler that will be called on success
request.done(function (response, textStatus, jqXHR) {
    // append the new option
    $("#EventId").append('<option value="' + response.id + '">' + response.text + '</option>');

    // get a list of selected values if any - or create an empty array
    var selectedValues = $("#EventId").val();
    if (selectedValues == null) {
        selectedValues = new Array();
    }
    selectedValues.push(response.id);   // add the newly created option to the list of selected items
    $("#EventId").val(selectedValues).trigger('change');   // have select2 do it's thing
});

Легко и приятно:

document.getElementById("select2-id_city-container").innerHTML = "Your Text Here";

А ты меняешь id_city на ваш идентификатор выбора.

Изменить: После комментария Глена я понимаю, что я должен объяснить, почему и как это работает для меня:

Я сделал select2 работать очень хорошо для моей формы. Единственное, что я не смог сделать, это показать текущее выбранное значение при редактировании. Это был поиск стороннего API, сохранение новых и редактирование старых записей. Через некоторое время я понял, что мне не нужно правильно устанавливать значение, только метка внутри поля, потому что, если пользователь не меняет поле, ничего не происходит. После поиска и поиска у многих людей, имеющих проблемы с этим, я решил сделать это с помощью чистого Javascript. Это сработало, и я написал, возможно, чтобы помочь кому-то. Я также предлагаю установить таймер для этого.

Другие вопросы по тегам