handlebarsjsとmarionettejsでフォームデータを保存

Question

Deployd APIを使用してフォームデータをサーバーに保存しようとしています。保存ボタンをクリックすると、サーバーで作成された新しい文書がデータを含んでいません。私はそれがどのように機能するのか理解していません。私は保存するためにモデルにデータを渡さなければならないと思いますか？それ、どうやったら出来るの？私はビューがすでにテンプレートとモデルにリンクしていると思った。 私はRequirejs、MarionetteJSとHandlebarsを使用しています。 ここにコードがあります。

MODEL：

define(['underscore','backbone'], function(_, Backbone){ 
var Student= Backbone.Model.extend({ 
    urlRoot: '/students', 
    defaults: { 
    nameStudent: '', 
    lastnameStudent: '' 
    }, 
    initialize: function(){ 
    console.log('studentModel: initiated'); 
    }, 
}); 
return Student; 
}); 

はVIEW：

define([ 
'jquery', 
'underscore', 
'backbone', 
'marionette', 
'handlebars', 
'js/models/student', 
'text!templates/forms/studentFormAdd.html' 

], function($, _, Backbone, Marionette, Handlebars, studentModel, studentFormAddTemp){ 

    var studentFormAdd = Backbone.Marionette.ItemView.extend({ 
     model: studentModel, 
     template: Handlebars.compile(studentFormAddTemp), 
     events: { 
      'click #saveBtn': function(){ 
       this.model.save();   
       console.log(this.model.toJSON()); 
       console.log('saveBtn event: initiated'); 
      } 
     }, 
     initialize: function(){ 
      console.log('studentFormAdd: initiated'); 
      this.model = new studentModel(); 
      this.model.on('change', this.render); 
     }, 
    }); 

マイテンプレートには、次のsintaxがあります

<div> 
<form> 
Student Name<br> 
<input type="text" name="nameStudent" value="{{nameStudent}}" placeholder="Student name"/> 
<br> 
Student lastname<br> 
<input type="text" name="lastnameStudent" value="{{lastnameStudent}}" placeholder="Student lastname"/><br> 
</form> 
</div> 

Answer 1

バックボーンので、2つの結合方法を使用していません：

this.model.save();   

イベントハンドラの saveBtnにある

が空です。あなたは双方向の結合を、リアルタイムたい場合は、使用することができます。 https://github.com/theironcook/Backbone.ModelBinderまたはhttps://github.com/NYTimes/backbone.stickit

あなたは、単にモデルでそれを提出し、保存時にフォームデータを消費するwan't場合は、https://github.com/marionettejs/backbone.syphonを使用することができます。

var data = Backbone.Syphon.serialize(this); 
this.model.set(data); 

this.model.save();