Name Address
Edit




or cancel

View model code

var viewModel = new function () {
    var self = this;
    self.Contacts = [
            { FullName: ko.observable('Eduard Trapeznichenko'), AddressString: ko.observable('USA, New York') },
            { FullName: ko.observable('Peter Archibald'), AddressString: ko.observable('Ukraine Kiev') }
        ];

    self.EditingPerson = ko.observable();

    self.Edit = function (person) {
        var currentEdititngPerson = self.EditingPerson();

        if (currentEdititngPerson && currentEdititngPerson != person) {
            if (currentEdititngPerson.hasChanges()) {
                if (confirm('Your have unsaved changes. Press Ok to cancel these changes. Press Cancel to continue editing')) {
                    currentEdititngPerson.rollback();
                } else {
                    return;
                }
            };
        }

        ko.editable(person); // since we do not have separate class for view model we enable ko.editables before edit itself.
        person.beginEdit();
        self.EditingPerson(person);
    };

    self.Update = function () {
        self.EditingPerson().commit();
        self.EditingPerson(undefined);
    };

    self.Cancel = function () {
        self.EditingPerson().rollback();
        self.EditingPerson(undefined);
    };
} ();