2012-04-11 94 views
1

我有一個用戶界面,有一個窗體,下拉和檢查框,以過濾從服務器返回的結果。骨幹JS過濾器形式

我不知道是否需要創建一個模型,以保持當前的設置可用,或只是用jQuery獲取vals並將它們傳遞給Collections獲取。

什麼會更好?

回答

2

這取決於你想投資多少錢設計,或者你可以採用更實用的方法。

如果您運行的設計解決方案,我們可以說,沒有什麼結果,我們都打在這裏的Collection。它是一個FilterSearch模型,每次我們發送過濾參數到服務器我們正在做的是創建FilterSearch的一個實例。假設:

POST http://myapp.com/filter_searchs?field1=value1&field2=value2 

服務器將接受此請求並返回結果數組。比方說:

{ 
    "field1": "value1", 
    "field2": "value2", 
    "results": [ "result1", "result2" ] 
} 

的骨幹FilterSearch模式將更新由服務器響應的信息:

var myFilterSearch = App.FilterSearch.new({ field1: "value1", field2: "value2" }); 
myFilterSearch.save({ wait:true }); 

從那裏我們可以創建結果Collection

var myResults = App.Results.new(myFilterSearch.get("results")); 

(所有代碼均已簡化且未經測試)

0

另一種解決方案可以將過濾器字段自己存儲到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(); 

這種做法很有趣,因爲你可以更新的結果只是修改集合中過濾器領域和來電.fetch(),所有到集合中的引用將保持不變。

(所有代碼都被簡化,未測試)

0

對於過濾收集利用骨幹網的最好的辦法是取收集和返回一個子集過濾收集這也將讓你的代碼的可重用性

爲了使過濾器,你應該有一個過濾功能

var yourCollection = Backbone.Collection.extend ({ 
    filtered : function() { 

我建議使用下劃線過濾器,將用於有效和虛假無效的,其中TRU返回true e是你正在尋找的東西。使用this.models來獲取當前的集合模型使用模型。得到(「」)來獲得,例如,你可以有一個複選框,你要檢查 元素,顯示一個特定的類別

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