jquery - 在4.0.3 js中使用远程源时如何在Select2中设置值

Question

在我的应用程序中有一个场景，我们在控件中显示标签分离值，因此我们选择 select 2 。

  <select id="ddlGulfEmployee" multiple="multiple" style="display: none; 
 width: 
 100%;" class="form-control"></select>

 </script>`$("#ddlGulfEmployee").select2({
    ajax: {
        url: '@System.Web.VirtualPathUtility.ToAbsolute("~/Home/GetMasterUser")',// '@Url.Action("GetMasterUser","Home") %>', //"../GetMasterUser",
        dataType: 'json',
        delay: 250,
        data: function (params) {
            debugger;
            return {
                q: params.term, // search term
                page: params.page
            };
        },
        processResults: function (data) {
            debugger;
            var arr = []
            $.each(data, function (index, value) {
                //debugger;
                arr.push({
                    id: value.ID,
                    text: value.FirstName
                })
            })
            return {
                results: arr
            };
        },
        cache: true
    },
    escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
    minimumInputLength: 1,
    templateResult: function (people) {
        debugger;
        //debugger;
        if (people.loading)
            return people.text;

        var markup = '<option value="' + people.id + '">' + people.text + '</option>';

        return markup;
    },
    templateSelection: function (people) {
        debugger;
        return people.value || people.text
    }
    //,
    //initSelection: function (element, callback) {
    //    debugger;
    //    callback($.map(element.val().split(','), function (id) {
    //        return { id: id, text: id };
    //    }));
    //}
});
$("document").ready(function () {//I WANT LIKE THIS OPTION 
    //1 russell 
    $('#ddlGulfEmployee').select2('val', ["test1", "test2"], true);

});

`

当我们保存数据并从远程源获取数据时，它工作正常，但问题是当我们想要在编辑期间显示保存的值以控制页面加载时。

请帮助我。

感谢和问候

Answer 1

请尝试此代码。

这里需要以键和值的格式传递数据。

$("document").ready(function () {
        $("#ddlGulfEmployee").select2({
               data: [
                {
                  id: '1',
                  text: 'option 1'
                },
                {
                  id: '2',
                  text: 'option 2'
                },
                {
                  id: '3',
                  text: 'option 3'
                }

              ]
        });
    });

您也可以 checkin select2 here

希望这有帮助。