Как проверить поле ввода в модальном режиме начальной загрузки

У меня есть основной вид, как показано ниже:

app.View.WelcomeProfil = Backbone.View.extend({
initialize : function(){
this.header = document.createElement('div');
this.$header = $(this.header);
this.render();
},

model : new app.Model.AccountProfile(),

template : {
header : _.template($('#welcome-profile-header').html()),
body : _.template($('#welcome-profile').html()),
error : _.template($('#welcome-profile-error').html())
},

attributes : {
'class' : 'form-horizontal row-fluid'
},

tagName : 'form',

next : function(){
var self = this;

_.each(this.$el.serializeArray(), function(value){
  self.model.set(value.name, value.value);
});

this.model.save(null, {
  success : function(model){
    self.trigger('next');
  },
  error : function(model){
    self.$el.append(self.template.error());
  }
});
},

previous : function(){
 this.trigger('previous');
},

render: function(){
var self = this;

this.$header.html(this.template.header());
this.model.fetch({
  success : function(model){
    self.$el.html(self.template.body(model.toJSON()));
  },
  error : function(model){
    self.$el.html(self.template.body(model.toJSON()));
    self.$el.append(self.template.error());
  }
});
return this;
},

destroy : function(){
  this.$header.remove();
  this.remove();
  this.trigger('remove', this);
}
});

Мой шаблон выглядит следующим образом

<script type="text/template" id="welcome">
<div class="modal-header">
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
  <@ if (previous) { @><input type="button" class="pull-left" value="<fmt:message key="foobar.form.previous"/>"/><@ } @>
  <@ if (next) { @><input type="button" class="pull-right" value="<fmt:message key="foobar.form.next"/>"/><@ } @>
  <@ if (finish) { @><input type="button" class="pull-right" value="<fmt:message key="foobar.form.finish"/>"/><@ } @>
</div>

This is the template which is inserted inside modal-body

<script type="text/template" id="welcome-profile">
<fieldset>
<div class="control-group">
  <label class="control-label" for="firstName"><fmt:message key="foobar.user.firstName"/></label>
  <div class="controls">
    <input type="text" class="input-block-level" name="firstName" required="required" placeholder="<fmt:message key="foobar.user.firstName"/>" value="<@= firstName @>">
  </div>
</div>
<div class="control-group">
  <label class="control-label" for="lastName"><fmt:message key="foobar.user.lastName"/></label>
  <div class="controls">
    <input type="text" class="input-block-level" name="lastName" required="required" placeholder="<fmt:message key="foobar.user.lastName"/>" value="<@= lastName @>">
  </div>
</div>
<div class="control-group">
  <label class="control-label" for="jobTitle"><fmt:message key="foobar.user.jobTitle"/></label>
  <div class="controls">
    <input type="text" class="input-block-level" name="jobTitle" required="required" placeholder="<fmt:message key="foobar.user.jobTitle"/>" value="<@= jobTitle @>">
  </div>
</div>

Я хочу, чтобы, когда пользователь нажимает «Далее» ... каким-то образом я мог проверить, заполнены ли поля имени, фамилии и должности или нет ..? Это возможно.


backbone.js backbone-views backbone-routing
person Saurabh Kumar    schedule 13.08.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Создайте метод validate в своей модели следующим образом: http://backbonejs.org/#Model-validate

После создания backbone автоматически вызовет этот метод перед запуском сохранения, и вы можете выполнить привязку к событию invalid, чтобы обновить представление с ошибкой.

person Lee    schedule 13.08.2013
comment
Как я могу поместить метод проверки в свое представление, потому что я думаю, что мне нужно что-то сделать, когда нажимается следующая кнопка - person Saurabh Kumar; 13.08.2013
comment
Когда нажата следующая кнопка, вызовите model.isValid, затем, если false, проверьте validationError, оба из которых являются первым и вторым свойствами/методами после предоставленной мной ссылки... - person Lee; 13.08.2013