将复选框绑定到具有 Knockout.js (MVC Razor) 的数组



我有一个Knockout.js视图模型,如下所示:

"UserName":null,
"FirstName":null,
"LastName":null,
"Countries":{
    "arrCountries":[]
}

以及一组国家/地区复选框,它们都必须使用相同的data-bind值呈现(我正在使用这个自定义 CheckBoxListFor 助手,它可以将自定义 HTML 应用于每个复选框,但每个复选框都是相同的自定义 HTML。它需要一个属性,该属性列出了我的剃刀视图模型中的每个可用国家/地区来创建复选框,然后根据另一个剃须刀视图模型属性将一些国家/地区呈现为标记(。

复选框值是整数(1、2、3 等(,我想将其放入视图模型的 arrCountries 属性中。

以下是复选框目前呈现的方式:

<input checked="checked" data_bind="checked: ???" id="Countries.arrCountries107" name="Countries.arrCountries" type="checkbox" value="1"></input>

我已经证明了使用 viewModel.Countries.arrCountries.push(1); 更新视图模型的概念(然后是一条警报,让我对 arrStates 中的元素进行计数以证明push有效(,但我似乎无法将复选框上的 data-bind HTML 属性连接起来,以便在我发送pushremove命令时它们检查和取消选中。

任何帮助非常感谢!

使选中的数据属性指向所选国家/地区。如果复选框的值位于复选框数组中,则将选中它。否则不会。

<input checked="checked" data-bind="checked: Countries" type="checkbox" value="3"></input>

看看我放的这个小提琴。

http://jsfiddle.net/u8xP9/3/

最新更新