2013-05-17 3 views
3

Я использую плагин отображения knockoutjs для создания модели представления из JSON. Затем я связываю свойства этой модели с полями в моей форме. Вопрос в том, как я могу сделать поля в модели, сгенерированной из JSON?Нокаутовое обязательное поле с использованием JSON

Например, если я загружаю JSON как это:

$.getJSON('/Department/GetEmptyModel/', function (data) { 
    var mapped = ko.mapping.fromJS(data); 
    self.AddDepartmentModel(mapped); 
}); 

И сохранить это так:

self.AddDepartmentModel.AddDepartment = function() { 
    $.ajax({ 
     url: "/Department/Add/", 
     type: 'post', 
     data: ko.toJSON(self.AddDepartmentModel), 
     contentType: 'application/json', 
     success: function (result) { 
      self.ListOfDepartments.GetListOfAllDepartments(); 
     } 
    }); 
}; 

Как я могу убедиться, что все необходимые поля есть до наступления спасбросок?

Благодаря

ответ

1

Вы должны проверить данные перед отправкой его на сервер. Посмотрите в плагин проверки для нокаута: https://github.com/ericmbarnard/Knockout-Validation

Я надеюсь, что это поможет решить проблему.

2

У меня была аналогичная проблема некоторое время назад, и это, как я ее решил:

Добавить пользовательский расширитель

ko.extenders.spaceNotAllowed = function(target, options){ 
    target.hasError = ko.observable(); 
    target.validationMessage = ko.observable(); 
    var validate = function(newValue) { // Validation for a field that shouldnt contain spaces 
     if(value.indexOf(" ") === -1) target.hasError(false); 
     else { 
      target.hasError(true); 
      target.validationMessage(target.hasError() ? options.errorMessage || "No spaces allowed" : ""); 
     } 
    } 
    validate(target()); 
    target.subscribe(validate); 
    return target;  
} 

В ViewModel:

Используйте расширитель в моя модель просмотра для полей, которые нуждаются в валидации

var ViewModel = { 
    var self = this; 
    self.noSpaces = ko.observable('initialValue').extend({spaceNotAllowed: {errorMessage: 'no spaces allowed'}}); 
} 

Вариант 1 Теперь, если у вас есть кнопка отправки на вашем HTML-странице, вы можете данных привязку это следующим образом:

<button type='button' data-bind='click: saveStuff, enable: !noSpaces.hasError'>Save</button> 

Таким образом, «кнопку Сохранить» будет включена только в случае, если валидация проходит. Я нашел этот ответ некоторое время назад, когда у меня была такая же проблема, и когда я был довольно новичком в нокауте.

Вариант 2 Проверьте, если поля действительны перед AJAX:

if(self.noSpaces.hasError) { 
    // Do something here 
    return; 
} 
$.ajax(....); 

Эта ссылка объясняет, как использовать пользовательские удлинителей в нокауте: Using extenders to augment observables

Смежные вопросы