2013-03-14 52 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 
    } 
});