Implementieren von Backbone-Validierung mit Formular

Question

Ich bin ziemlich neu in Backbone und ich habe einige Probleme (ich denke, ich brauche noch etwas Hilfe von fortgeschrittenen Benutzer).

habe ich eine Form wie folgt aus:

<form class="SectionContainer-Content container form-horizontal" role="form" id="addAquaForm"> 
    <div class="form-group"> 
     <label for="aquarium_name">Name</label> 
     <input type="text" name="aquarium_name" id="aquarium_name" value="" placeholder="" class="form-control" /> 
    </div> 
    <div class="form-group"> 
     <label for="aquarium_volume">Volume</label> 
     <input type="text" name="aquarium_volume" id="aquarium_volume" value="" placeholder="" class="form-control" /> 
    </div> 
    <div class="form-group"> 
     <label for="aquarium_type">Type : </label> 
     <select class="form-control" id="aquarium_type"> 
      <option>first</option> 
      <option>second</option> 
     </select> 
    </div> 
</form> 

Dann erstelle ich ein Modell:

var app = app || {}; 

app.Aquarium = Backbone.Model.extend({ 

    validation: { 
    aquarium_name: { 
     required: true, 
     msg: 'Please enter a valid name' 
    }, 
    aquarium_volume: { 
     required: true, 
     msg: 'Please enter a valid volume' 
    }, 
    aquarium_type: { 
     required: true 
    } 
    } 
}); 

Und dann die Ansicht, die die Form pilote:

var AquariumFormView = Backbone.View.extend({ 
    tagName: "form", 
    id: "addAquaForm", 
    events: { 
     'click #btn-new-aqua': "addAqua" 
    }, 
    initialize: function() { 
     // This hooks up the validation 
     this.model = new pedia.Aquarium(); 
     Backbone.Validation.bind(this); 
    }, 
    addAqua: function() { 
     var data = this.$el.serializeObject(); 

     this.model.set(data); 

     // Check if the model is valid before saving 
     if (this.model.isValid(true)) { 
      // this.model.save(); 
      alert('Great Success!'); 
     } 
    }, 
    remove: function() { 
     // Remove the validation binding 
     Backbone.Validation.unbind(this); 
     return Backbone.View.prototype.remove.apply(this, arguments); 
    } 
}); 

Als ich lade meine Seite, die Ansicht ist nicht initialisiert, aber ich habe keine Ahnung, wie ich das machen könnte.

Jemand könnte mir ein paar Ideen geben?

Thanks :)

Answer 1

Wenn Sie die Ansicht initialisiert werden soll, wenn die Seite geladen wird:

$(document).ready(function(){ 
var view = new AquariumFormView(); 
});