使用敲除來更新選中的框並存儲選定的值

我有一個複選框列表，我希望能夠選擇和取消選擇所有選項，並將選定的值存儲在淘汰賽陣列中。使用敲除來更新選中的框並存儲選定的值

這裏是我的HTML

<a><span data-bind="click: selectAllUsers">SELECT ALL</span></a> 
<a><span data-bind="click: deselectAllUsers">DESELECT ALL</span></a> 
<ul data-bind="foreach: users"> 
     <li> 
      <input type="checkbox" data-bind="checked: $parent.selectedUsers" /> 
      <span data-bind="text: name"></span> 
     </li> 
</ul>

下面是我的javascript的部分：

var userData = //populated earlier 
self.users = ko.observableArray([]); 
self.selectedUsers = ko.observableArray([]); 
self.selectAllUsers = function() { 
    self.selectedUsers(userData) 
} 

self.deselectAllUsers = function() { 
    self.selectedUsers([]); 
}

當視圖模型被初始化，用戶和selectedUsers兩者初始化爲存儲在用戶對象的數組用戶數據。就目前而言，複選框不會自動檢查，當我檢查/取消選中時，它會影響複選框中的所有選項。理想情況下，它只會改變選定的複選框並更新選定的用戶。

來源

2016-07-29 manufan22122

如果您有沒有value屬性的複選框，那麼您必須分配相應的值與checkedValue綁定。你的情況：

<input type="checkbox" data-bind="checked: $parent.selectedUsers, checkedValue: $data" />

https://jsfiddle.net/xrxskyx8/1/

來源

2016-07-29 18:31:52

@f_martiznez謝謝！ checkedValue：$數據是問題所在。我仍然遇到一個小問題，那就是在選擇DESELECT ALL後SELECT命令被選中時，以及排除或包含其他選項時，SELECT ALL按鈕並不會實際選擇全部。對不起，如果這沒有任何意義。看起來複選框並未針對全部選中的所有用戶進行更新。 – manufan22122

@ manufan22122，我探討了你的問題。看起來你試圖用*相同的數組變量*初始化多個可觀察數組。這是不正確的做法。使用'userData.slice（0）'創建數組的副本（裏面的對象將保持原始）。查看更新的小提琴：https：//jsfiddle.net/xrxskyx8/2/ –

謝謝你！我對Knockout比較陌生，所以我沒有辦法想到這一點。感謝幫助的人 – manufan22122

使用敲除來更新選中的框並存儲選定的值

回答

相關問題