5

I want to pass and fetch a value from the view to model use of a collection, i am able to pass the value into the model when i used collection it is not working .i don't know where is the problem here is my code .

my model

var PostwallModel=Backbone.Model.extend({

    urlRoot: 'http://localhost:3400/post',
    idAttribute: '_id',
    defaults : {
        userId: '',
        userName: " ",
        postmsg : "unknown"
    },

    initialize: function() {
        console.log("<><><>post model initialize<><><><><>");
    },

    // Delete item (row) from
    clear: function() {
        this.destroy();
    }

});

my collection

var PostwallCollection = Backbone.Collection.extend({
    url: 'http://localhost:3400/post',
    model: PostwallModel
});

**here is my view**

var PostwallView = Backbone.View.extend({

    el: $("#page"),
    template: _.template(PostwallTemplate),

    events: {
        'click #postinwall'        : 'submitpost',
    },

    initialize: function() {
        console.log("_______postmodel");
        this.model = new PostwallModel();
        var obj= new PostwallModel();
        obj.set({userId:'123',userName:"str ji",postmsg:'the post is here'});
        console.log(obj.get('postmsg'));
        obj.toJSON();

        console.log(JSON.stringify(obj));

        // console.log(obj.get('userName'));

        var collection = new PostwallCollection();

        _.bindAll(this, 'submitpost');

        console.log(collection);
        collection.add(obj,{id:1});
        console.log("collection"+collection);
        console.log("collection fetch value "+JSON.stringify(collection.fetch()));
        this.render();
    },

    render: function() {
        alert(" render function");
    },

    submitpost: function(e) {
        //Save post model to server data
        e.preventDefault();
        var post_data = JSON.stringify( this.getFormData( this.$el.find('form') ) );
        //
        //this.model.save(post_data);
        this.model.set(post_data);
        this.collection.add(this.model);
        return false
    },

    //Auxiliar function
    //how to get data from textarea

});

here i am getting in console----> [],collection fetch value[object Object],where is the problem and how to save and fetch the value.

Brian Riehman
  • 27,020
  • 2
  • 24
  • 17
Sport
  • 8,570
  • 6
  • 46
  • 65
  • 1
    did you know, that .fetch() is asynchronous operation ? console.log("collection fetch value "+JSON.stringify(collection.fetch())); wouldn't work. Can you give jsbin example for more help? – Vasiliy vvscode Vanchuk Apr 04 '14 at 18:44
  • i didn't get your point please can you give some more information @VasilVanchuk – Sport Apr 05 '14 at 18:48
  • 1
    That is what about i am talking: collection.fetch() doesn't return collection data, cause fetch make http request and data will be accessible only on successful processing response. So when you write like console.log("collection fetch value "+JSON.stringify(collection.fetch())); you wouldn't see collection data – Vasiliy vvscode Vanchuk Apr 06 '14 at 12:07

1 Answers1

1

Try this:

var self = this;
collection.fetch()({
    success: function (data) {
        console.log("collection fetch value "+data);
        self.render();
    }
});

You want to only execute render once your fetch is successful. The fetch method runs asynchronously. This means everything after it will still try to execute while the fetch method is still doing its thing. By placing the render method in the success callback you ensure nothing tries to use your collection data until you actually have that data.

Katherine C
  • 245
  • 2
  • 11