Проверка данных в форме перед добавлением данных в базовую коллекцию

Привет, я новичок в опоре. Я пытаюсь подписаться на http://listen-dom-events-backbone.herokuapp.com/. Я изменил HTML, чтобы ввести три атрибута: имя возраст и род занятий

<form id="addPerson" action="">
        <input type="text" placeholder="Name of the person" id="name">
        <input type="text" placeholder="Age" id="age">          
        <input type="text" placeholder="Occupation" id="occ">
        <input type="submit" value="Add Person">
</form>
    <script id="personTemplate" type="text/template">
<span><strong><%= name %></strong> (<%= age %>) - <%= occupation %></span> 
<button class="edit">Edit</button>
<button class="delete">Delete</button>
    </script>

И валидация моего позвоночника - что-то вроде этого.

App.Views.AddPerson = Backbone.View.extend({
el: '#addPerson',

events: {
    'submit': 'submit'
},

submit: function(e) {
    e.preventDefault();
    var newPersonName = $(e.currentTarget).find('input[type=text]').val();
    var newage = $(e.currentTarget).find(age).val();
    var newocc = $(e.currentTarget).find(occ).val();
    var person = new App.Models.Person({name: newPersonName, age: newage, occupation: newocc});

            // Only when the data exists it has to be added to the collection
            // This is what i tried

           // Method 1: 
    var attributes = person.attributes();
    validate: function(){
        if(attributes.newage ==null){alert("Please Enter Age")}
    if(attributes.newocc ==null){alert("Please enter occupation")}      
    }

            //Method 2
            var attributes = person.attributes();
    validate: function(attributes){
        if(attributes.newage !=null){person.set({age: newage});}
        if(attributes.newocc !=null){person.set({occupation: newocc});
            }

            // Only if everything above is correct this value should be returned
    this.collection.add(person);

}

});

Я делаю это правильно или что-то не так?

1 ответ

Решение

Валидация должна проводиться в модели, именно так определяется позвоночник. Если вы посмотрите на документацию, вы увидите, что есть validate метод, isValid метод, а также validationError свойство в модели, которое начинает иметь смысл при переопределении validate метод. Так что ваши validate метод в Person Например, модель может быть определена следующим образом.

App.Models.Person = Backbone.Model.extend({
  // some other methods
  validate: function(attributes, options) {
    var errors = [];
    if(_.isEmpty(attributes.age)) {
      errors.push("age missing");
    }
    if(_.isEmpty(attributes.occupation)) {
      errors.push("occupation missing");
    }
    if(!_.isEmpty(errors)) {
      return errors;
    }
  }
});

тогда вы сможете позвонить isValid на вашей модели, и в случае, если это не так, ошибки проверки, возвращаемые вашим validate метод будет доступен через validationError приписывать. Затем вы можете изменить свой метод отправки на что-то вроде этого:

 submit: function(e) {
    e.preventDefault();
    if(this.model.isValid()) {
      // do what you want with your model
    } else {
      alert(this.model.validationError.join('\n'));
    }
  }
Другие вопросы по тегам