backbone_basic_2_vews

by ddehghan

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://backbonejs.org/backbone-min.js"></script>
<div id='log'></div>

CSS

div#log {
    border-bottom: 1px solid #afafaf;
    width: 100%;
    height: 100px;
    overflow: scroll;
    background: #5f5f5f;
    font: 11px verdana;
    color: white;
    padding: 3px 5px;
}
div#log p {
    margin-bottom: 2px;
}

JavaScript

var log = function (txt) {
    //debugger;
    $("div#log").append("<p>" + JSON.stringify(txt) + "</p>");
};

var model1 = Backbone.Model.extend({
    storeThis: function (data) {
        this.set('payload', data);
        return;
    }
});

var collection1 = Backbone.Collection.extend({
    model: model1,

    pickMe: function () {
        for (i = 0; i < this.models.length; i++) {
            this.models[i].storeThis("Hello");
            log(this.models[i]);
        }
    }
});

var model2 = Backbone.Model.extend({
    storeThis: function (data) {
        this.set('payload', data);
        return;
    }
});

var collection2 = Backbone.Collection.extend({
    model: model2,

    pickMe: function () {
        for (i = 0; i < this.models.length; i++) {
                        debugger;

            this.models[i].storeThis("Hello");
            log(this.models[i]);

            col1.models[0].storeThis("xxxxxx");
            log(col1.models[0]);

        }
    }
});


col1 = new collection1([{
    name: 'jack'
}, {
    name: 'joe'
}]);

col2 = new collection2([{
    name: 'sarah'
}, {
    name: 'jane'
}]);

col1.pickMe();
col2.pickMe();