淘汰賽選擇/取消

我使用淘汰賽映射JSON obejct用戶控制所有的組合框，我有一個複選框列表，它們看起來像淘汰賽選擇/取消

<input type="checkbox" data-bind="checked: IsEnabled1" />

我有JSONObject的

var viewModel = { 
      IsEnabled1 :ko.observable(true),    
      IsEnabled2 :ko.observable(true), 
      IsEnabled3 :ko.observable(false) 
     }; 
    ... 
    ko.applyBindings(viewModel);

我想添加將檢查/取消選中所有其他的全局複選框，我在JavaScript端進行了此更改，但全局複選框更新UI部分，但它們來自單獨複選框的數據不映射到JSON對象。

全球複選框

$("#GeneralTable thead tr th:first input:checkbox").click(function() { 
      var checkedStatus = this.checked; 
      $("#GeneralTable tbody tr td:first-child input:checkbox").each(function() { 
       this.checked = checkedStatus;      
      }); 

     });

這個代碼我的JSON對象後，包含不相關的UI數據。

如何更新JS端更改後的所有JSON複選框？

來源

2012-01-31 Arbejdsglæde

您發佈的代碼是不夠的，我們來回答你的問題。 – 2012-01-31 15:00:49

現在應該會更好。謝謝。 – 2012-01-31 15:18:14

代碼中的問題，即與節點交互的問題。但是你需要與數據交互。這在MVVM世界更好:-)請檢查我的答案。我認爲它會爲你工作。 – Romanych 2012-01-31 15:32:14

請檢查例子：http://jsfiddle.net/MenukaIshan/5gaLjh2c/

我認爲這正是你所需要的。所有物品都有IsChecked可觀察財產。 ViewModel包含計算的observable（可讀和可寫）來檢查或取消選中所有項目。

來源

2012-01-31 15:30:54 Romanych

這是使用的完美例子。讓我的一天兩次！ – 2014-09-22 13:13:08

使用類似的代碼。我嘗試了你的小提琴，但在我的情況下，我正在使用knockout-3.2.0.js，它不工作（即使在小提琴中），但使用knockout-2.0.0.js。任何線索。 – 2016-04-07 10:23:37

3.2.4對此沒有任何作用 – 2017-06-19 16:48:13

這裏有http://jsfiddle.net/rniemeyer/kXYuU/

上述解決方案可以通過兩種方式

得到改善 - 要做出AllChecked假空列表，我們需要檢查長度

- 要減少的替代解決方案選擇所有的長列表時數重新計算，我們需要增加油門

self.AllChecked = ko.computed({ 
    read: function() { 
     var firstUnchecked = ko.utils.arrayFirst(self.Items, function(item) { 
      return item.IsChecked() == false; 
     }); 
     return self.Items.length && !firstUnchecked; 
    }, 
    write: function(value) { 
     ko.utils.arrayForEach(self.Items, function(item) { 
      item.IsChecked(value); 
     }); 
    } 
}).extend({ throttle: 1 });

來源

2013-05-10 07:19:40

淘汰賽選擇/取消

回答

相關問題