淘汰賽可保存排序順序

Question

我正在使用淘汰賽可訂購插件，並希望保存重新顯示錶格內容的排序順序。我可以這樣做還是應該使用其他插件？

<tr> 
    <th data-bind="orderable: { collection: 'orders', field: 'name' }">Name</th> 
    <th data-bind="orderable: { collection: 'orders',field: 'group' }">Group</th> 
</tr> 

Answer 1

在初始化時，orderable綁定處理程序與2個可觀測量，orderField和orderDirection延伸的集合。你可以簡單地subscribe這些觀察到的，並保持他們的數據到sessionStorage（或localStorage）：

var vm = { orders: [...] }; 

// load recent values from storage to be passed as the defaults 
vm.people.__lastOrderField = sessionStorage['ko__orderField']; 
vm.people.__lastOrderDirection = sessionStorage['ko__orderDirection']; 

// apply bindings first, in order to activate the plugin 
ko.applyBindings(vm); 

// subscribe to relevant fields once they're created by the plugin 
vm.people.orderField.subscribe(function(val) { sessionStorage['ko__orderField'] = val; }); 
vm.people.orderDirection.subscribe(function(val) { sessionStorage['ko__orderDirection'] = val; }); 

而在你的HTML：

<a href="#" data-bind="orderable: {collection: 'people', field: 'firstName', defaultField: people.__lastOrderField === 'firstName', defaultDirection: people.__lastOrderDirection }">First Name</a> 
<a href="#" data-bind="orderable: {collection: 'people', field: 'lastName', defaultField: people.__lastOrderField === 'lastName', defaultDirection: people.__lastOrderDirection }">Last Name</a> 
<a href="#" data-bind="orderable: {collection: 'people', field: 'age', defaultField: people.__lastOrderField === 'age', defaultDirection: people.__lastOrderDirection }">Age</a> 

見Fiddle