基於另一種形式的價值

Question

嗨Knockout.js變更表值，我有一個包含一個是/否單選按鈕組，另一組用約3單選按鈕值的形式。

我試圖實現一個動態的地方，如果第一個問題的值是「無」，它會選擇第二組中的特定單選按鈕，並從改變值禁用用戶。如果用戶選擇「是」，他們可以再挑他們從第二組想要的任何選項。

我有狀態的功能禁用正常工作，但我很努力，如果「否」選項，在第一

我的代碼選擇來獲得的功能來選擇第二組中的「0」單選按鈕是：

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

嘗試使用訂閱。

的訂閱功能接受三個參數：回調是 函數被調用每當通知發生，靶 （可選）定義在回調函數的這個值，並且 事件（可選;默認值是「變「）是事件 的名義接收通知。

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

它會觸發您的每一次變化isEligibleStateBenefitCd。

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

對於禁用不使用它的股利，試試吧：

<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 

工作例如：

$(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'){ 
 
     \t self.weeklyPrsiContributionsRate('0'); 
 
      
 
     } 
 
    }); 
 
    
 
    } 
 

 
    var data = { 
 
    "isEligibleStateBenefitCd": 'Y' 
 
    }; 
 
    
 
    var vm = new ViewModal(data); 
 
    ko.applyBindings(vm); 
 
});

<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>