淘汰赛：添加/删除基于另一个选择下拉列表的选择下拉列表

-1

我正在使用淘汰赛为以下情况构建用户界面： - 我有一个项目数组。每件商品都有一系列商品细节。 - 物品明细可以是以下两种类型之一：'类型A'或'类型B'。 - 如果项目细节类型为A，则它可以具有以下两种子类型之一：“子类型A-1”和“子类型A-2”。 - 如果项目明细是B类型，则它没有子类型。淘汰赛：添加/删除基于另一个选择下拉列表的选择下拉列表

My fiddle

我有两个问题/问题：

我想基于“Detail类型”下拉列表中的值增加/删除“详细亚型”下拉列表。例如，如果用户选择'Type B'，我想删除'Detail Subtype'下拉菜单。我也想将底层'subtype'属性的值设置为null。我使用if绑定但无济于事
在视图模型的addItemDetail方法中，如何添加新的项目详细信息？

来源

2012-08-10 user1590749

希望我有足够的声誉下降投票。在得到答案后，删除小提琴会有点粗鲁。没有人可以看到可能从所提供的答案中学习的细节。 – 2012-09-20 15:08:20

您不应该删除作为问题一部分的小提琴。你的问题现在不完整，没有提供有价值的背景。 – rlcrews 2013-10-29 17:54:16

物品细节是含有包含常规性质，不可观测量常规对象的可观察数组。您已经创建了“pm.itemDetail”构造函数，那么为什么不使用它呢？

pm.Item = function(name, itemDetails) { 
    // ...  
    var details = []; 
    for (var i = 0; i < itemDetails.length; i++) { 
     details.push(new pm.ItemDetail(itemDetails[i])); 
    } 
    self.itemDetails = ko.observableArray(details); 
};

我已经更新了pm.ItemDetail起作用的位：

pm.ItemDetail = function(data) { 
    var self = this; 
    self.name = ko.observable(data.name); 
    self.type = ko.observable(data.type); 
    self.subtype = ko.observable(data.subtype); 
};

现在，您可以使用“看得见的”结合（“如果”绑定隐藏了DOM的内容节点，而不是节点本身）：

data-bind="visible: type() == 1, ..."

要添加新的项目细节，只是创建的“pm.ItemDetail”实例，并将其推到它emDetails阵列当前选择的项目：

addItemDetail = function(item) { 
    selectedItem().itemDetails.push(new pm.ItemDetail({ 
     name: "Please enter a name", 
     type: 1, 
     subtype: 1 
    })); 
};

http://jsfiddle.net/XscRT/6/

来源

2012-08-10 17:27:11 Niko

谢谢。我有一个后续问题。在这个小提琴中（[link]（http://jsfiddle.net/casudeo/WLZrc/2/）），我添加了一个saveItem方法，在该方法中我提醒了子类型属性的值。无论类型的值是什么，子类型都有一个值。如果选择类型B，是否有方法将子类型设置为null？或者，在将保存发送到服务器之前，是否让我的saveItem足够智能以忽略子类型值，如果type = 1。 – user1590749 2012-08-10 18:30:33

我的意思是以上类型== 2。 – user1590749 2012-08-10 18:36:46

你可以做这两件事，但简单地忽略价值有时会容易得多。 – Niko 2012-08-10 19:04:10

1）你差点没钱了。你在if表达式中缺少（）。

2）您可以添加一个项目的细节是这样的...

addItemDetail = function(item) { 
    // what should be here to add a new detail to an item? 
    selectedItem().itemDetails.push(new pm.ItemDetail()); 
};

我也修改了如何通过添加新项目的项目细节。注意下面的小提琴中的for循环。

这把小提琴具有以上所有功能。

http://jsfiddle.net/johnpapa/FWFPV/

来源

2012-08-10 17:21:04

a）小提琴根本不工作。 b）让构造函数返回“this”有什么意义？我的意思是，'新pm.ItemDetail（）'返回“这个”无论如何，对吧？ – Niko 2012-08-10 17:33:24

对不起，我修正了提琴（错字） – 2012-08-10 17:41:21

b）在这种情况下不需要它。 – 2012-08-10 17:44:23

淘汰赛：添加/删除基于另一个选择下拉列表的选择下拉列表

回答

相关问题