Knockout.js仅在值更改时启用保存

时间:2014-03-26 20:39:14

标签: javascript html knockout.js

我有一个带有值输入和保存按钮的简单html页面。 我希望只有在更改了值时才会启用保存(somtimes已初始化且somtimes不是。

我尝试了一些没有成功的事情

HTML

<input type="text"
    placeholder="type here"
    data-bind="value: rate,"/>
<button data-bind="click: save">Save</button>

JS

    var viewmodel = function () {
        this.rate = ko.observable('88').extend(required: true);
    };

    viewmodel.prototype.save = function () {
        alert('save should be possible only if rate is changed);
    };

同样在jsfiddle

1 个答案:

答案 0 :(得分:0)

应该能够通过计算的observable和enable绑定来实现这一点。 见http://jsfiddle.net/brendonparker/xhLrB/1/

使用Javascript:

var ctor = function () {
    var self = this;
    self.originalRate = '88';
    self.rate = ko.observable('');
    self.canSave = ko.computed(function(){
        return self.originalRate == self.rate();
    });
};

ctor.prototype.save = function () {
    alert('save should be possible only if rate is changed');
};

ko.applyBindings(new ctor());

HTML:

<input type="text" placeholder="type here" data-bind="value: rate, valueUpdate: 'afterkeydown'"/>
<button data-bind="click: save, enable: canSave">Save</button>