Как да проверите полето за въвеждане в режим на първоначално зареждане

Имам изглед на гръбнака, както следва:

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>

Искам, когато потребителят щракне след това ... по някакъв начин да мога да проверя дали полетата за име, фамилия и длъжност са попълнени или не..? Възможно ли е това.


person Saurabh Kumar    schedule 13.08.2013    source източник


Отговори (1)


Създайте validate метод на вашия модел така: http://backbonejs.org/#Model-validate

Веднъж създаден, backbone автоматично ще извика този метод, преди да изпълни запазването, и можете да се свържете със събитието invalid, за да актуализирате изгледа с грешката.

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