2013-03-14 53 views
0

設置默認值我是新來Knockout.js 我在UI 3場。 產品價值。 數量 合計用於計算可觀測Knockout.js

一切工作正常與計算observable,並可以保存數據。由於一些商業原因,總數將在後端更改。

雖然檢索數據後,我需要顯示從DB作爲初始值的總,但是當用戶chnages產品和值,應使用原始計算的功能。

我試圖bindingHandlers但無法得到它的權利..

幫助將是非常可觀的。

var TsFoundationDeviceModel = function(product,qty,total) { 
    var self = this; 
    self.product = ko.observable(product); 
    self.quantity= ko.observable(qty); 
    self.computedExample = ko.computed(function() { 
     return self.product() * self.quantity() ; 
    }); 
} 

<input name="product" data-bind="value:product"> 
<input name="value" data-bind="value:value"> 
<input name="total" data-bind="value:computedExample"/> 
+0

請發佈您的代碼或您嘗試過的內容。 – 2013-03-14 23:33:06

+0

所以問題是當你從數據庫獲取數據或當用戶更新輸入值時 – 2013-03-14 23:38:57

+0

問題是我如何設置我從服務器獲得的數據(即總計)以及產品價值和數量,但Knockout最初不應該執行計算,因爲總計是一個計算字段。它應該只顯示我從服務器獲得的總價值,以及用戶何時在ProductValue和數量中指定某些內容,這些值應該更改。 – 2013-03-14 23:41:11

回答

3

您可以做到這一點的唯一方法是跟蹤初始值設定項。因此,第一次調用viewmodel時,將初始化設置爲true,並檢查總數是否未定義。如果是,則返回總計,重置初始化。從那裏開始,它總是會根據另外兩個字段更新計算結果。

下面是相同的小提琴(順便說一下,有一個在您綁定的錯誤,有一個由名爲「價值」沒有財產,我以爲這是數量

http://jsfiddle.net/sujesharukil/YTDZ9/

在essensce,你會一次返回總體上,第一次創建您的視圖模型的實例。

希望這有助於!

-Suj

0

就我能從你那裏得到的是,你存儲3個輸入,你從數據庫中得到它的價值。

當一些用戶通過點擊保存按鈕數據應被髮送到服務器以更新或在DB插入,並且當被加載的形式的輸入應當與從DB用戶的數據來填充。

所以,你應該使用這個目的KnockoutJS mapping plugins

使用該插件,您只需將ajax調用到您的服務器以獲取數據並將其轉換爲ViewModel然後在您的html上應用ViewModel即可。

,並使用相同的插件,你可以把你ViewModel成JSON格式,併發送回服務器將其保存在數據庫中。

+0

謝謝Ebram.I這樣做沒有問題,但在我的例子中,當我得到總價值時,我怎樣才能把這個價值分配給總額。現在,它將根據產品和價值進行計算,根據我的要求當頁面加載時或者直到用戶在產品或價值中指明某些東西時纔會發生。來自Knockoutjs文檔的 – 2013-03-14 23:52:56

+0

「計算的觀測值是依賴於一個或多個其他觀測值的函數,並且只要這些相關性發生變化就會自動更新。」 – 2013-03-14 23:55:07

+0

我很努力設置從服務器的默認值到總輸入..除此之外,一切都OK。可以有人幫助嗎? – 2013-03-14 23:57:12

0

如果我知道你想什麼正確的,你可以有計算的自動返回初始值,除非觀測改變。

self.product = ko.observable(product); 
self.quantity= ko.observable(qty); 
self.orig_product = ko.observable(product); 
self.orig_quantity= ko.observable(qty); 

self.computedExample = ko.computed(function() { 
    if (self.product() !== self.orig_product 
     || self.quantity() !== self.orig_quantity()) { 
     return self.product() * self.quantity() ; 
    } else { 
     // return the initial value 
    } 
});