Валидация сопоставления нокаутов

Я пытаюсь прикрепить проверку к отображаемому виду. Я использую плагины для нокаутов и валидации. Псевдо-модель:

Person {
    int Id;
    string Name;
    Book[] Books;
}

Book {
    int Id;
    string Name;
}

JavaScript:

function viewModel() {
    var self = this;
    self.persons = ko.observableArray();

    // persons are retrieved via AJAX...
    ko.mapping.fromJS(persons, {}, self.persons);
}

jQuery(function( $ ) {
    ko.applyBindings(new viewModel());
});

Как я могу расширять наблюдаемые данные пользователем для установки правил проверки и сообщений? Мне нужно проверить свойства суб-массива как для людей, так и для книг. Я нашел только примеры, которые используют явные настройки модели, без автоматического сопоставления, например:

Name: ko.observable().extend({ required: true })

Тогда мне нужно будет установить ko.validatedObservable, isValid и validation.init, но я действительно не знаю, как обрабатывать/организовывать это. Не могли бы вы помочь?

Ответы

Ответ 1

Я нашел по крайней мере два способа предоставления валидаций для моделирования или просмотра объектов модели, созданных с помощью плагина ko.mapping:

  • Используйте параметры сопоставления, чтобы прикрепить правила проверки при создании определенных свойств.
  • атрибуты HTML5. Это поддерживается только для некоторых валидаций (т.е. Требуемого, шаблона). Подробнее см. Документацию для плагина для проверки нокаута.

Вышеуказанные два метода также могут быть объединены. Ниже приведен пример fiddle.

1. Использование параметров сопоставления

Плагин Nockout Mapping позволяет настраивать определенные свойства на сопоставленных объектах. Воспользовавшись этой функциональностью, вы можете переопределить поведение плагина по умолчанию и добавить подтверждение для ваших отображаемых свойств. Ниже приведен пример

HTML

<input data-bind="value: name" />


Javascript

var data = { name: "Joe Shmo" };

var validationMapping = {
    // customize the creation of the name property so that it provides validation
    name: {
        create: function(options) {
            return ko.observable(options.data).extend( {required: true} );
        }
    }
};

var viewModel = ko.validatedObservable(ko.mapping.fromJS(data, validationMapping));
ko.applyBindings(viewModel);


2. Атрибуты HTML5

Плагин проверки нокаута поддерживает ограниченный набор атрибутов проверки HTML5, которые можно использовать в элементах управления HTML. Однако использование их требует включения опции parseInputAttributes. Вот простой пример:

HTML

<input data-bind="value: name" required />


Javascript

// this can also be configured through the "validationOptions" binding (https://github.com/ericmbarnard/Knockout-Validation/wiki/Validation-Bindings)
ko.validation.configure({
    parseInputAttributes: true
});

var data = { name: "Joe Shmo" };

var viewModel = ko.validatedObservable(ko.mapping.fromJS(data));
ko.applyBindings(viewModel);

Ответ 2

Другим способом является расширение наблюдаемого после его отображения.

function viewModel() {
    var self = this;
    self.persons = ko.observableArray();

    // persons are retrieved via AJAX...
    ko.mapping.fromJS(persons, {}, self.persons);


    self.Name.extend({ required: true });
}