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

查看：

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

Backbone不使用双向绑定，因此：

this.model.save();

saveBtn事件处理程序中的

为空。如果您想要实时双向绑定，可以使用： https://github.com/theironcook/Backbone.ModelBinder或https://github.com/NYTimes/backbone.stickit

如果您不想在提交时使用表单数据并将其保存在模型中，则可以使用https://github.com/marionettejs/backbone.syphon。

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

 this.model.save();

使用handlebarsjs和marionettejs保存表单数据

1 个答案: