Forms 使用AJAX和初始本地数据选择2

因此，我试图让select2插件与Backbone.js/CakePHP应用程序配合使用。其想法是，此select2保存任务完成时与人联系的电子邮件地址，但表单是可编辑的。我要做的是：（1）加载/显示正在编辑的任务的所有已保存电子邮件地址；（2）我仍然希望select2执行AJAX搜索以列出已识别的电子邮件。 我经常遇到这样的问题，我可以显示初始数据，也可以使用AJAX搜索功能

我的select2框的当前代码是主干。视图，它看起来像：

define([
    'backbone',
    'jquery',
    'jquery.select2'
],
function(Backbone, $, select2) {

    var notificationSelector = Backbone.View.extend({

        notifications: undefined,

        events: {
            'change' : 'select2ContactsChanged'
        },

        initialize: function(attrs) {
            this.collection.on('add remove reset', this.render(), this);
            this.select2ContactsChanged(); 
        },                              

        render: function() {

            var contacts = ["abc@def.com", "joe@banana.com"];
            $('.notification-selector').attr('value', contacts);



            if(this.select2Control == undefined) 
            {
                // Do Search() + query here
                this.select2Control = this.$el.select2({
                    width: '200px',
                    placeholder: '@email',
                    tags: [],
                    minimumInputLength: 3,

                    // initSelection: function(element, callback) {
                    //  return $.ajax({
                    //      type: "GET",
                    //      url: "/notifications/fetch/",
                    //      dataType: 'json',
                    //      data: { id: (element.val()) },
                    //      success: function(data) {

                    //      }
                    //  }).done(function(data) {
                    //      console.log(data);
                    //  });
                    // },

                });
            }
            else
            {
                // Do Search() + query here
                this.select2Control = this.$el.select2({
                    width: '200px',
                    placeholder: '@email',
                    tags: [],
                    minimumInputLength: 3,

                    ajax: {
                        url: '/notifications/search/',
                        dataType: 'json',
                        data: function(term, page) {
                            return {
                                SearchTerm: term
                            };
                        },

                        results: function(data, page) {
                            return {
                                results: data
                            };
                        }
                    }
                });
            }

        },

        select2ContactsChanged: function() {
            var contacts = this.select2Control.val().split(',');
            this.collection.reset(contacts);
        }

    });

    return notificationSelector;
});

我阅读了Select2的创建者对其他人（）的回复，他在回复中说使用“自定义查询”来实现我想要的东西。我很难找到相关的例子，也很难理解这些文档的含义。 有人能看出我做错了什么/遗漏了什么吗

谢谢你的时间

编辑

---

我忘了提到——它所附加的DOM元素是

好的，我终于找到了解决方案。 我误解了$.ajax（）--我并没有真正认为它实际上是一个异步调用。我检查调用返回的数据的代码是在AJAX实际完成之前运行的，所以我总是没有定义

我为AJAX调用分配了一个变量，并设置了“async:false”，它工作得非常好

fetchSetNotifications: function() {
            var addresses = $.ajax({
                method: 'GET',
                dataType: 'json',
                context: $('#notifications'),
                url: '/Notifications/fetch/',
                async: false,

            alert(addresses);
        }

---

然后，我在“addresses”中得到的jqXHR对象在“responseText”属性中包含了我想要的响应数据。

值得注意的是，同步AJAX请求已被弃用，不应使用：和