フォームによるバックボーン検証の実装

Question

私はBackboneでかなり新しく、いくつかの問題があります（上級ユーザーの助けが必要です）。

私はこのような形式を追加しました：

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 
    } 
    } 
}); 

し、フォームを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); 
    } 
}); 

Iその後、私はモデルを作成

<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> 

私のページをロードすると、ビューは初期化されませんが、私はどのようにそれを行うことができるのか分かりません。

誰かに私にいくつかのアイデアを与えることができましたか？

感謝:)

Answer 1

あなたは、ページのロード時にビューを初期化したい場合：

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