2013-03-22 71 views
0

說明輸入欄顯示爲NaN

嗨,我使用的淘汰。我有三個複選框和一個輸入字段。當我點擊複選框時,複選框的值應該出現在輸入字段上。但是,我沒有看到複選框的值,而是看到了NaN。

jsFiddle link

function ViewModel() { 
    var self = this; 
    self.primaryClass = ko.observable("50"); 
    self.secondaryClass = ko.observable("40"); 
    self.otherClass = ko.observable("10"); 

    self.selectedValues = ko.observableArray([]); 

    self.sum = ko.computed(function() { 
     var total = 0; 
     ko.utils.arrayForEach(self.selectedValues(), function (item) { 
      total += parseInt(item); 
     }); 
     return total; 
    }); 

} 

ko.applyBindings(new ViewModel()); 
+0

http://jsfiddle.net/uFQdq/4/ – Stranger 2013-03-22 17:02:31

+0

@mcpDESIGNS,感謝您的更新 – Stranger 2013-03-22 17:15:00

回答

1

檢查了這一點:

http://jsfiddle.net/Dtwigs/uFQdq/5/

做這樣的投入,使它們動態:

<label> 
<input data-bind="checked: selectedValues, value: primaryClass" type="checkbox"></input> 
<span data-bind="text: primaryClass"></span> 
</label> 

更改值以文本值。

+0

我沒有看到這個答案。那麼,你得到了信用。 – Stranger 2013-03-22 17:38:43

2

看代碼,在這條線上,

total += parseInt(item); 

變項是您的複選框的值。

<input data-bind="checked: selectedValues" type="checkbox" value="primaryClass">500</input> 
<input data-bind="checked: selectedValues" type="checkbox" value="secondaryClass">200</input> 
<input data-bind="checked: selectedValues" type="checkbox" value="otherClass">100</input> 

這意味着您正在嘗試parseInt("primaryClass") ...等等。

嘗試將複選框的值更改爲數字。

喜歡這裏:http://jsfiddle.net/2L4W9/

+0

現貨上,您正在添加字符串,因此NaN。我想你想要那些「值」爲'class =「primaryClass」'等 – 2013-03-22 17:09:59

+0

@mcpDESIGNS對,我想這就是他想要做的 – AlexCheuk 2013-03-22 17:10:41

+0

我不能在我的複選框中添加靜態值。這些值將會改變。這就是我觀察到的原因。那麼,我是否錯誤地設置了observable? – Stranger 2013-03-22 17:11:52