У меня есть select2 v4.0.0 заполняется из массива Ajax. Если я установлю значение для select2, то с помощью отладки javascript смогу увидеть, что он выбрал правильный элемент (в моем случае это # ​​3), однако в поле выбора это не отображается, но он по-прежнему показывает заполнитель.

В то время как я должен увидеть что-то вроде этого:

В моих полях формы:

<input name="creditor_id" type="hidden" value="3">
<div class="form-group minimal form-gap-after">
    <span class="col-xs-3 control-label minimal">
        <label for="Creditor:">Creditor:</label>
    </span>
    <div class="col-xs-9">
        <div class="input-group col-xs-8 pull-left select2-bootstrap-prepend">
            <select class="creditor_select2 input-xlarge form-control minimal select2 col-xs-8">
                <option></option>
            </select>
        </div>
    </div>
</div>

Мой JavaScript:

var initial_creditor_id = "3";
$(".creditor_select2").select2({
    ajax: {
       url: "/admin/api/transactions/creditorlist",
       dataType: 'json',
       delay: 250,
       data: function (params) {
           return {
                q: params.term,
                c_id: initial_creditor_id,
                page: params.page
           };
       },
       processResults: function (data, page) {
            return {
                results: data
            };
       },
       cache: true
   },
   placeholder: "Search for a Creditor",
   width: "element",
   theme: "bootstrap",
   allowClear: true
   }).on("select2:select", function (e) {
      var selected = e.params.data;
      if (typeof selected !== "undefined") {
           $("[name='creditor_id']").val(selected.creditor_id);
           $("#allocationsDiv").hide();
           $("[name='amount_cash']").val("");
           $("[name='amount_cheque']").val("");
           $("[name='amount_direct']").val("");
           $("[name='amount_creditcard']").val("");
        }
    }).on("select2:unselecting", function (e) {
        $("form").each(function () {
            this.reset()
        });
        ("#allocationsDiv").hide();
        $("[name='creditor_id']").val("");
    }).val(initial_creditor_id);

Как сделать так, чтобы в окне выбора отображался выбранный элемент, а не заполнитель? Должен ли я отправлять это как часть ответа AJAX JSON?

В прошлом Select2 требовал опцию initSelection, которая определялась всякий раз, когда использовался пользовательский источник данных, позволяющий определить начальный выбор для компонента. Это работало нормально для меня в v3.5.