我有一个带有下拉列表和复选框的 UI,以便过滤从服务器返回的结果。
我想知道我是否必须创建一个模型以保持当前设置可用,或者只使用 jquery 获取 val 并将它们传递给 Collections fetch。
什么会更好?
我有一个带有下拉列表和复选框的 UI,以便过滤从服务器返回的结果。
我想知道我是否必须创建一个模型以保持当前设置可用,或者只使用 jquery 获取 val 并将它们传递给 Collections fetch。
什么会更好?
这取决于您想在设计上投入多少,或者您可以采用更务实的方法。
如果您选择设计解决方案,我们可以说这里没有Collection
我们正在玩的结果。它是一个FilterSearch
模型,每次我们将过滤器参数发送到服务器时,我们所做的就是创建一个FilterSearch
. 比方说:
POST http://myapp.com/filter_searchs?field1=value1&field2=value2
服务器将接受此请求并将返回结果数组。比方说:
{
"field1": "value1",
"field2": "value2",
"results": [ "result1", "result2" ]
}
BackboneFilterSearch
模型将使用服务器响应的信息进行更新:
var myFilterSearch = App.FilterSearch.new({ field1: "value1", field2: "value2" });
myFilterSearch.save({ wait:true });
从那里我们可以创建我们的结果Collection
:
var myResults = App.Results.new( myFilterSearch.get( "results" ) );
(所有代码均已简化,未经测试)
另一种解决方案是将过滤器字段存储到Collection
它自身中。
App.Results = Backbone.Collection.extend({
url: function() {
return "/results?field1=" + this.field1 + "&field2=" + this.field2 );
}
});
var myResults = App.Results.new({ field1: "value1", field2: "value2" });
myResults.fetch();
这种方法很有趣,因为您只需修改 Collection 中的过滤器字段并调用即可更新结果,对 Collection.fetch()
的所有引用都将保留。
(所有代码均已简化,未经测试)
对于使用主干过滤集合,最好的方法是获取集合并返回一个子集过滤集合,这也将使您的代码更具可重用性
要制作过滤器,您应该具有过滤功能
var yourCollection = Backbone.Collection.extend ({
filtered : function () {
我建议使用 UnderScore 过滤器,它将为有效返回 true,为无效返回 false,其中 true 是您要查找的内容。使用 this.models 获取当前集合模型 使用 model.get( '' ) 获取您要检查的元素,例如,您可能有一个显示特定类别的复选框
var results = _.filter( this.models, function ( model ) {
if ( item.get('category') === 'y' )
return true ;
return false ;
});
您可以使用所有下拉列表和复选框继续过滤结果然后使用下划线映射您的结果并将其转换为 JSON
results = _.map( results, function( model ) { return model.toJSON() } );
最后返回一个只有结果的新主干集合
return new Backbone.Collection( results ) ;
或者,如果您不想保留集合中的所有数据,而只想保留已过滤的数据,则可以重置集合并跳过上面的返回,例如
this.reset( results ) ;
查看:在这里您的 ui 数据请求您应该在使用 jquery 为值传递 ui 后调用过滤函数