Backbone.js+；JQuery UI自动完成-奇怪的行为

我正在为我的SPA应用程序使用backbone.js，需要在其中包含JQuery UI自动完成小部件

型号

define(['underscore', 'backbone'], function(_, Backbone) 
{
   var Consumer = Backbone.Model.extend
   ({   
        initialize: function()
        {
        },
        toJSON: function() 
        {
            var data;

            var json = Backbone.Model.prototype.toJSON.call(this);

            _.each(json, function(value, key) 
            {
                 data = key;
            }, this);

            return data;
        }   
    });

    return Consumer;
});

收藏

define(['jquery', 'underscore', 'backbone', 'models/consumer'], function($, _, Backbone, Consumer)
{
    var Consumers = Backbone.Collection.extend
    ({
          model: Consumer,
          url: 'http://localhost/test',

          initialize: function()
          {
          }
    });

    return new Consumers;
});

查看

define(['jquery', 'underscore', 'backbone', 'text!templates/home.html', 'collections/consumers', 'jqueryui'], function($, _, Backbone, homeTemplate, Consumers)
{
      var HomeView = Backbone.View.extend
      ({
             el: $("body"),

             initialize: function()
             {
                  this.collection = Consumers;

                  this.collection.fetch(({async: false}));
             },
             events: 
             {
                  'focus #consumer': 'getAutocomplete',
             },
             render: function(options)
             {          
                  this.$el.html(homeTemplate);
             },
             getAutocomplete: function () 
             {
                  $("#consumer").autocomplete(
                  {
                        source: JSON.stringify(this.collection),
                  });
             }
    });

    return new HomeView;
 });

问题是autosuggest在用户键入时发送奇怪的GET请求

collection.fetch() 

使用以下JSON数组填充集合：

["11086","11964","14021","14741","15479","15495","16106","16252"]

当用户开始键入autocomplete（例如15）时，它会发送以下GET请求：

http://localhost/test/%5B%2211086%22,%2211964%22,%2214021%22,%2214741%22,%2215479%22,%2215495%22,%2216106%22,%2216252%22%5D?term=15

我的代码有什么问题？

String：使用字符串时，自动完成插件希望该字符串指向将返回JSON数据的URL资源

当你这样做的时候

$("#consumer").autocomplete({
  source: JSON.stringify(this.collection),
});

您提供了一个字符串，这使autocomplete认为您提供的是一个url，而不是一个数组：

$("#consumer").autocomplete({
  source: this.collection.toJSON();
});

但是，您必须为您的模型设置

标签

和

值

属性

我建议你做的是为你的收藏创建一些单独的功能

getSuggestions: function() {
  // returns an array of strings that you wish to be the suggestions for this collection
}

用它来代替：

$("#consumer").autocomplete({
  source: this.collection.getSuggestions();
});