Question

您好我有一个包含是/否单选按钮组的表单和另一个包含约3个单选按钮值的组。

如果第一个问题的价值是“不”，那么我试图实现动态。它将选择第二组中的特定单选按钮并禁止用户更改该值。如果用户选择“是”＆＃39;然后他们可以从第二组中选择他们想要的任何选项。

我禁用条件功能正常工作，但我很难获得选择＆＃39; 0＆＃39;第二组中的单选按钮如果没有＆＃39;选项在第一个

中选择

我的代码是：

this.isEligibleStateBenefitCd = ko.observable(args.isEligibleStateBenefitCd);
this.weeklyPrsiContributionsRate = ko.computed(args.weeklyPrsiContributionsRate);

HTML：

<div tabindex="0" class="radio-group" typeof="select_box">
<input data-bind="checked: isEligibleStateBenefitCd" value="Y" type="radio" name="isEligibleStateBenefitCd"/> Yes
<input data-bind="checked: isEligibleStateBenefitCd" value="N" type="radio" name="isEligibleStateBenefitCd"/> No
</div>

<div tabindex="0" class="radio-group" typeof="select_box" data-bind="enable: isEligibleStateBenefitCd() === 'Y'">
<input data-bind="checked: weeklyPrsiContributionsRate" value="238.30" type="radio" name="weeklyPrsiContributionsRate" id="48"> 48 or Over
<input data-bind="checked: weeklyPrsiContributionsRate" value="233.60" type="radio" name="weeklyPrsiContributionsRate" id="4047"> 40-47
<input data-bind="checked: weeklyPrsiContributionsRate" value="0" type="radio" name="weeklyPrsiContributionsRate" id="0"> N/A - €0
</div>

Answer 1

尝试使用订阅。

subscribe函数接受三个参数：callback是每当通知发生时调用的函数，target （可选）在回调函数中定义this的值，并且 event（可选;默认为＆＃34;更改＆＃34;）是事件的名称收到通知。

http://knockoutjs.com/documentation/observables.html

每次您的isEligibleStateBenefitCd更改时都会触发。

self.isEligibleStateBenefitCd.subscribe(function(newValue) {
   if(newValue == 'N'){
      self.weeklyPrsiContributionsRate('0');
   }
});

对于禁用，请不要在div上使用它，请尝试：

<input data-bind="checked: weeklyPrsiContributionsRate,enable: isEligibleStateBenefitCd() === 'Y'" value="238.30" type="radio" name="weeklyPrsiContributionsRate" id="48"> 48 or Over

<input data-bind="checked: weeklyPrsiContributionsRate,enable: isEligibleStateBenefitCd() === 'Y'" value="233.60" type="radio" name="weeklyPrsiContributionsRate" id="4047"> 40-47

<input data-bind="checked: weeklyPrsiContributionsRate" value="0" type="radio" name="weeklyPrsiContributionsRate" id="0"> N/A - €0

工作示例：

＆＃13;

$(function(){

  function ViewModal(opt_data) {
    var data = opt_data || {};

    self.isEligibleStateBenefitCd = ko.observable(data.isEligibleStateBenefitCd || 'N');
    self.weeklyPrsiContributionsRate = ko.observable();
    
    self.isEligibleStateBenefitCd.subscribe(function(newValue) {
        if(newValue == 'N'){
        	self.weeklyPrsiContributionsRate('0');
          
        }
    });
    
  }

  var data = {
    "isEligibleStateBenefitCd": 'Y'
  };
  
  var vm = new ViewModal(data);
  ko.applyBindings(vm);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

<div tabindex="0" class="radio-group" typeof="select_box">
<input data-bind="checked: isEligibleStateBenefitCd" value="Y" type="radio" name="isEligibleStateBenefitCd"/> Yes
<input data-bind="checked: isEligibleStateBenefitCd" value="N" type="radio" name="isEligibleStateBenefitCd"/> No
</div>

<div tabindex="0" class="radio-group" typeof="select_box">

<input data-bind="checked: weeklyPrsiContributionsRate,enable: isEligibleStateBenefitCd() === 'Y'" value="238.30" type="radio" name="weeklyPrsiContributionsRate" id="48"> 48 or Over

<input data-bind="checked: weeklyPrsiContributionsRate,enable: isEligibleStateBenefitCd() === 'Y'" value="233.60" type="radio" name="weeklyPrsiContributionsRate" id="4047"> 40-47

<input data-bind="checked: weeklyPrsiContributionsRate" value="0" type="radio" name="weeklyPrsiContributionsRate" id="0"> N/A - €0

</div>

＆＃13;

Knockout.js根据另一个表单值更改表单值

1 个答案: