2012-02-16 26 views
2

我想创建一个网页与窗体,一旦用户更改任何字段,立即验证和更新提交,而不是让用户点击提交按钮。我正在使用Knockout.js和映射插件。我知道我可以通过为每个原始字段创建一个计算字段来实现此目的,但是这种工作是枯燥乏味的,是否有很好的做法来创建一个通用侦听器来侦听任何字段中的任何更改并分别更新后端?即时更新后端与Knockoutjs

回答

5

为了订阅任何更改,您可以使用ko.toJS()方法。实际上它允许遍历对象图和展开可观察对象。正如您在使用ko.computed时可能知道的那样,它会订阅所有观察值字段的读取内容,并在每次更改时重新评估。所以,如果你使用这样的代码:

ko.computed(function() { 
    ko.toJS(viewModel); 
    // update data on server 
}); 

你也应该注意这一段代码将初始化之后更新服务器数据。它可以很容易地避免。请结帐这个例子:http://jsfiddle.net/UAxXa/embedded/result/

另外我想你可能只想发送更改的数据到服务器。你可以合并ko.editbales插件(https://github.com/romanych/ko.editables)和一些KO引擎盖知识。请结帐此示例:http://jsfiddle.net/romanych/RKn5k/

我希望它可以帮助你。

0

你有几个选择,但如果你想要一个单一的监听器,一个好方法是使用我用来创建一个更改跟踪器的相同代码。它只是倾听可观察到的变化。它大约有19行代码。您可以抓住它,而不是将其用于更改跟踪,只需连接一种方法即可在发生更改时保存更改。

要设置更改跟踪,这种跟踪器属性添加到您的视图模型:

viewModel.tracker = new ChangeTracker(viewModel); 

钩到这些视图,以确定在发生变化时:

viewModel.tracker().somethingHasChanged(); 

钩到您的视图模型时您希望在功能复位状态(例如:加载,保存):

viewModel.tracker().markCurrentStateAsClean; 

或者,你可以通过你自己的状态跟踪散列函数了。