How do I set up a base model and view it without defining a collection? There is currently an empty request payload

I thought I had a sample Model, ModelView, Collection, AppView on github / documentcloud / backbone that I understood reasonably so far ..

I tried to set up something more stripped down. I'm trying to just have Model

and View

.

My problem

Data post doesn't work; the request payload on the network trace is empty , what am I missing?

I've got the complete code up on the jsFiddle here (A). I also tested that the sample code that works in my environment also works in on jsFiddle (B) and checking the network shows that the request payload has data.

Model and View Code

window.MyModel = Backbone.Model.extend({
    urlRoot: '/api/m',
});

window.MView = Backbone.View.extend({
    template: _.template($('#template').html()),
    el: $('#modelfields'),

    initialize: function () { this.model.bind('change', this.render, this); },

    events: {
        "click .save": function () { this.model.save(); }
    },
    render: function () { 
        $(this.el).html(this.template(this.model.toJSON()));
        return this;
    },
});

window.MyMView = new MView({model: new MyModel});

      

network window screenshots

+3


source to share


1 answer


Your model has no properties! Set some default values, or call this.model.set ({..}) to add them.

I've updated your example to include the default and fields from the form.



window.MyModel = Backbone.Model.extend({
    defaults: {
        'defaultvalue':'somedefault'                                     
    },
    urlRoot: '/api/m',
});

window.MView = Backbone.View.extend({
    template: _.template($('#template').html()),
    el: $('#modelfields'),

    initialize: function () { this.model.bind('change', this.render, this); },

    events: {
        "click .save": 'save'
    },
    save: function() {
        var description = this.$("#Description").val();
        var moreData = this.$("#MoreData").val();
        this.model.set({"description":description,"more":moreData});
        this.model.save();            
    },
    render: function () { 
        $(this.el).html(this.template(this.model.toJSON()));
        return this;
    },
});

window.MyMView = new MView({model: new MyModel});

      

+3


source







All Articles