Javascript 正在验证触发其他内容的下拉输入

Javascript 正在验证触发其他内容的下拉输入,javascript,knockout.js,knockout-validation,Javascript,Knockout.js,Knockout Validation,我有一个输入,一个的,根据选择的是哪一个,我希望显示更多的输入字段。这就是它在js中的样子: protectionInput: ko.computed({ read: function () { return ""; }, write: function (value) { if (value == "Primary") { viewModel.enhancementVisible(true);

我有一个输入,一个
,根据选择的是哪一个,我希望显示更多的输入字段。这就是它在js中的样子:

protectionInput: ko.computed({
    read: function () {
        return "";
    },
    write: function (value) {
        if (value == "Primary") {
            viewModel.enhancementVisible(true);
            viewModel.individualVisible(false);
        } else if(value == "IP14" || value == "IP16") {
            viewModel.enhancementVisible(false);
            viewModel.individualVisible(true);
        } else {
            viewModel.enhancementVisible(false);
            viewModel.individualVisible(false);
        }
    },
})
问题是,我还需要这是一个必填字段,以便选择其中一个选项。对于我的其他输入,我得到了以下结果(使用ko验证):

someInput: ko.observable().extend({
    required: true,
}),
但是,当我将它添加到上面的计算结果中时,即使选择了一个选项,它的计算结果也总是无效的

有什么想法吗?如果我以一种愚蠢的方式做了这件事,我很乐意重组。提前感谢您的帮助

PS,这是标记的外观:

<div class="form">
    <label>Type of protection</label>
    <select data-bind="value:protectionInput" required>
        <option value="" disabled selected hidden>Please select an option</option>
        <option>Primary</option>
        <option>FP12</option>
        <option>FP14</option>
        <option>FP16</option>
        <option>IP14</option>
        <option>IP16</option>
    </select>
    <label>Enhancement factor</label>
</div>
<div class="form" data-bind="visible: enhancementVisible">
    <input type="number" data-bind="value:enhancementInput" required min="0" max="100" />
</div>
<div class="form" data-bind="visible: individualVisible">
    <label>Individual factor</label>
    <input type="number" data-bind="value:individualInput" required />
</div>

保护类型
请选择一个选项
主要的,重要的
FP12
FP14
FP16
IP14
IP16
增强因子
个体因素

您的代码是如何设置的还不清楚,但我认为您最好将您的计算重新构造为可观察的,并使用订阅。这样,您就可以对可观察对象使用验证,并且在值更改时仍然更新其他属性。在本例中,我不得不对视图模型进行一些假设,因此如果您的属性不在视图模型的根上,则必须替换“自”引用

self.protectionInput = ko.observable("").extend({ required: true });

self.protectionInput.subscribe(function(value){
  if (value == "Primary") {
      self.enhancementVisible(true);
      self.individualVisible(false);
  } else if(value == "IP14" || value == "IP16") {
      self.enhancementVisible(false);
      self.individualVisible(true);
  } else {
      self.enhancementVisible(false);
      self.individualVisible(false);
  }
});

首先,我猜你在计算机的写入部分将变量设置为真/假,你想设置的是可见(真/假)而不是输入(真/假)?是的,正是-调整了变量名,将其发布在这里,并清除了一点css,所以忘了更改它。(现在已经为将来访问并试图理解此代码的任何人修复了它)啊,太棒了,订阅正是我想要的。我觉得我不应该在那里使用计算机。这太完美了。谢谢你,杰森!