ノックアウトjcライブラリは初めてですが、助けてもらえますか? このようなJavaScriptで新しいモデルを作成しました。
コードは次のとおりです。
<h2>Category : Throusers</h2>
<h3>Sizes</h3>
<ul data-bind="foreach: products">
<li>
<input type="checkbox" data-bind="value: size.id" />
<label data-bind="text: size.name"></label>
</li>
</ul>
<h3>Colors</h3>
<ul data-bind="foreach: products">
<li>
<input type="checkbox" data-bind="value: color.id" />
<label data-bind=" text: color.name"></label>
</li>
</ul>
<h3>Products</h3>
<ul data-bind="foreach: products">
<li>
<label data-bind="text: name"></label> -
<label data-bind="text: size.name"></label>-
<label data-bind="text: color.name"></label>
</li>
</ul>
<script type="text/javascript">
function Color(id, name) {
return {
id: ko.observable(id),
name: ko.observable(name)
};
};
function Size(id, name) {
return {
id: ko.observable(id),
name: ko.observable(name)
};
}
function Product(id,name, size, color) {
return {
id: ko.observable(),
name: ko.observable(name),
size: size,
color: color
};
};
var CategoryViewModel = {
id: ko.observable(1),
name: ko.observable("Throusers"),
products: ko.observableArray([
new Product(1,"Levi's 501", new Size(1, "30-32"), new Color(1, "Red")),
new Product(2,"Colins 308", new Size(2, "32-34"), new Color(2, "Black")),
new Product(3,"Levi's 507", new Size(1, "30-32"), new Color(3, "Blue"))
])
};
ko.applyBindings(CategoryViewModel);
</script>
そしていま、
- 私はこれが欲しいです: 重複したサイズと色はリストされるべきではありません.
- 色から色を選択すると、選択した色の製品がリストされ、他の製品が無効になるはずです
モデルが間違っている場合は?