使用Ajax选择2 4.0.0初始值

Question

我有一个从Ajax数组填充的select2 v4.0.0。如果我设置了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中，这对我来说效果很好。

Answer 1

我还没有看到人们真正回答的一种情况是，当选项来自AJAX时，如何进行预选择，您可以选择多个。由于这是AJAX预选择的转到页面，因此我将在此处添加解决方案。

$('#mySelect').select2({

    ajax: {

        url: endpoint,

        dataType: 'json',

        data: [

            { // Each of these gets processed by fnRenderResults.

                id: usersId,

                text: usersFullName,

                full_name: usersFullName,

                email: usersEmail,

                image_url: usersImageUrl,

                selected: true // Causes the selection to actually get selected.

            }

        ],

        processResults: function(data) {

            return {

                results: data.users,

                pagination: {

                    more: data.next !== null

                }

            };

        }

    },

    templateResult: fnRenderResults,

    templateSelection: fnRenderSelection, // Renders the result with my own style

    selectOnClose: true

});