如何在骨干视图中绑定bootstrap typeahead的数据源?

时间:2012-12-20 14:19:40

标签: backbone.js twitter-bootstrap bootstrap-typeahead

我有一个骨干视图。我想在搜索文本字段中发生的每个更改中从服务器设置bootstrap typeahead的数据源。我怎样才能做到这一点??这是我的搜索视图

window.SearchByChoiceView = Backbone.View.extend({

initialize: function () {
    this.model = new SearchByChoiceModel();
    this.render();
},

render: function () {
    $(this.el).empty().html(this.template(this.model.toJSON()));
    return this;
},

});


window.SearchByChoiceModel = Backbone.Model.extend({

initialize: function () {     
},

defaults: {
    id: 1,
    SearchKeyword: "",
    "tags": new Array()

}
});

这是我的搜索字段:

 <input type="text"  required placeholder="search" class="input-span3" id="SearchKeyword" title= "Search Keyword" name="SearchKeyword" value="<%= SearchKeyword %>" style="margin: 0 auto;" data-provide="typeahead" data-items="4">

请有人帮忙。我是一名有骨干的乞丐。可能很容易,但对我来说很难处理。我已经尝试了很多。

1 个答案:

答案 0 :(得分:2)

我相信你可以这样做:

$( '.typeahead' ).typeahead( {
    source : typeAhead.people.pluck( 'name' )
  } );
});

“typeAhead.people”是您的集合实例。在你的情况下

myApp.myCollection.pluck( 'SearchKeyword' )

JSBin:

http://jsbin.com/upigej/1/edit