使用backbone.js将表单对象保存到模型

时间:2012-08-16 02:02:19

标签: javascript backbone.js

我无法将表单对象发布,这是我到目前为止只使用测试数据我得到的setTarget.save是未定义的。我可以使用类似的结构成功获取fetch / get调用。

视图

define([
'jquery',
'underscore',
'backbone',
'text!templates/default/parent.html'
], function($, _, Backbone, parentTemplate) {
var defaultView = Backbone.View.extend({

    initialize: function() {
      $(this.el).html(parentTemplate);
                this.render();
    },

            events: {
                'click #busNext': 'showTarget'
            },

            showTarget: function() {
      this.model.set({
        businessName: $('#busInfoName').val(),
      });
                this.model.save();
    },

            render: function() {
                this.setValidator();
      return this;
    }

});
return new defaultView;
});

模型

define([
  'underscore',
  'backbone'
], function(_, Backbone) {
  var setTarget = Backbone.Model.extend({

    initialize: function() {
        console.log('set target initialize');
    },

    url: 'test.htm',

    defaults: {
        businessName: "",
        businessPhone: ""
    }

    });

  return setTarget;
});

收藏

define([
  'jquery',
  'underscore',
  'backbone',
'models/setTarget'
], function($, _, Backbone, setTarget){
  var target = Backbone.Collection.extend({

    model: setTarget,

  });

  return new target;
});

路由器

define([
  'jquery',
  'underscore',
  'backbone',
'validate',
'views/default/parent',
'models/setTarget',
'collections/target'
], function($, _, Backbone, validate, defaultView, setTarget, target) {
var AppRouter = Backbone.Router.extend({

    routes: {
                    '': 'defaultAction',
                    'index': 'defaultAction',
    },

    defaultAction: function(actions) {
      this.changePage(defaultView, 'fade');
    },

    changePage: function(page, pageTransition) {
        $('body').append($(page.el));
        $.mobile.changePage($(page.el), { changeHash: true, transition: pageTransition     });
        }

    });

    var initialize = function() {
        var app_router = new AppRouter;
        Backbone.history.start();
    };

    return {
        initialize: initialize
    };
});

1 个答案:

答案 0 :(得分:0)

感谢您的评论,在阅读完之后,我决定采用不同的方式。而不是使用model.save,我使用了collectioninstancename.fetch方法,并在集合中覆盖了设置,以便它可以POST而不是GET,它似乎工作正常。