敲除checkedValue綁定不顯示檢查

我想獲得一個基於兩個observablearrays檢查複選框的列表。第一個有幾個programids，第二個將有programids的所有記錄。 observablearray的數據都來自數據庫。敲除checkedValue綁定不顯示檢查

基本上我試圖獲取ProgramID已經分配給ProgramIDs數組中的用戶的列表，並將其與AllPartnerPrograms數組的數組進行比較，並顯示與檢查匹配的數組。

然後，我希望能夠從新列表中檢查並將其發送回服務器，以使用新的programid列表更新用戶的數據。

我不知道爲什麼checkedValue綁定不起作用，或者我不明白如何使它工作。我在這裏用相同的代碼創建了一個fiddle。

我假設$root.AllPartnerPrograms將根據self.ProgramIDs陣列顯示檢查的項目，但這並未發生。

如果我把這樣的代碼，它會被檢查，但不會顯示其他記錄。

<input type="checkbox" data-bind="checkedValue: ProgramID, checked: ProgramID" />

如果我改變的foreach到然後我得到其他記錄，但仍然沒有檢查基於第一個列表上。

我在這裏做錯了什麼？

我的代碼

<div id="programs"> 
<!-- ko foreach: ProgramIDs -->     
<input type="checkbox" data-bind="checkedValue: ProgramID, checked: $root.AllPartnerPrograms" />     
<span data-bind="text: ProgramName"></span> 
<!-- /ko -->

視圖模型

var objPartnerPrograms; 
vmPartnerProgramsModel = function() { 
var self = this; 

self.ProgramIDs = ko.observableArray(
[{ProgramID: 16002,ProgramName: "Program1"}, 
{ProgramID: 16003,ProgramName: "Program2"}, 
{ProgramID: 16005,ProgramName: "Program3"}, 
{ProgramID: 16006,ProgramName: "Program4"}, 
{ProgramID: 16011,ProgramName: "Program5" 
}]); 

self.AllPartnerPrograms = ko.observableArray(
[{ProgramID: 16002,ProgramName: "Program1"}, 
{ProgramID: 16003,ProgramName: "Program2"}, 
{ProgramID: 16005,ProgramName: "Program3"}, 
{ProgramID: 16006,ProgramName: "Program4"}, 
{ProgramID: 16011,ProgramName: "Program5"}, 
{ProgramID: 16102,ProgramName: "Program6"}, 
{ProgramID: 16104,ProgramName: "Program7" 
}]); 
}; 

$(document).ready(function() { 
    objPartnerPrograms = new vmPartnerProgramsModel() 
    ko.applyBindings(objPartnerPrograms, $("#programs")[0]); 
});

來源

2014-12-07 Adrian

你的句子開頭*「我的目標是在這裏」 *，然後它開始變得非常不清楚。你能改述一下嗎？ – Tomalak 2014-12-07 09:26:52

重申希望現在更清楚 – Adrian 2014-12-07 09:32:42

不是，我很害怕。但我覺得你正在試圖做錯事。你真的*有兩個名單，或者你真的有*一個*名單，其中一些項目是檢查（「分配」，無論你稱之爲），而其他人不是？我想你正試圖爲一些並不是非常難的問題建立一個令人困惑的用戶界面。也許最好描述一下你想要表示的數據，而不是你想要爲其構建的UI。 – Tomalak 2014-12-07 09:38:05

您的視圖模型ProgramIDs屬性應該只包含選定的項目，而不是全要素的標識：

self.ProgramIDs = ko.observableArray([16002, 16003, 16005, 16006, 16011]);

您還需要結合完整列表財產foreach結合和使用ProgramIds託運結合：

<div id="programs"> 
    <!-- ko foreach: AllPartnerPrograms -->  
    <input type="checkbox" data-bind="checkedValue: ProgramID, checked: $root.ProgramIDs" /> 
    <span data-bind="text: ProgramName"></span> 
    <!-- /ko --> 
</div>

查看更新後的jsFiddle。

來源

2014-12-07 09:46:59 dotnetom

你沒有在你的foreach循環中正確地確定你的observable，它應該通過$ data來訪問。

說了這樣的話，我只保留一個可觀察的列表和所有選項。將此選項擴展爲具有一個布爾值，該選中字段可以正常工作。當您將值保存回數據庫時，您可以循環訪問數組並獲取已檢查的值。

var self = this; 
var Program = function(id, name, isChecked) { 
    return { 
     id: ko.observable(id), 
     name: ko.observable(name), 
     isChecked: ko.observable(isChecked) 
    } 
} 

self.programArray = ko.observableArray([]); 
// populate observable array checking the programs that match in both your lists 
self.programArray.push(new Program(1234, 'name', true)); 

// in page 
<!-- ko foreach: programArray --> 
    <input type="checkbox" data-bind="checked: $data.isChecked" /> 
<!-- /ko -->

HTH

來源

2014-12-07 09:48:58

如果你管理顯示和編輯選項，他的腳本： ''

敲除checkedValue綁定不顯示檢查

回答

相關問題