mauron85/backbone-nested-update.html

## backbone-nested-update.html
<html>
<head>
    <title></title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
    <script src="http://underscorejs.org/underscore.js"></script>
    <script src="http://backbonejs.org/backbone.js"></script>
    <script>
        var Friend = Backbone.Model.extend({
            move: function(pos) {
                this.set('pos', pos);
                return this;
            }
        });
        var Friends = Backbone.Collection.extend({
            model: Friend
        });
        var Meeting = Backbone.Model.extend({
            initialize: function () {
                this.set('friends', new Friends());
            }
        });
        var Meetings = Backbone.Collection.extend({
            model: Meeting
        });

        var CreateMeetingView = Backbone.View.extend({
            setMeetings: function(meetings) {
                this.meetings = meetings;
            },
            createNewMeeting: function () {
                var friend = new Friend({name: 'Marian'});
                var meeting = new Meeting();
                meeting.get('friends').add(friend);
                this.meetings.add(meeting);
            }
        });
        var MapView = Backbone.View.extend({
            initialize: function () {
                var self = this,
                    meetings = this.meetings = this.options.meetings;
                meetings.each(function (meeting) {
                    var friends = meeting.get('friends');
                    friends.each(function (friend) {
                        friend.on('change', self.friendMoved);
                    });
                });
            },
            friendMoved: function (friend) {
                testFriendMoved(friend)
            }
        });

        var meetings = new Meetings();
        var createMeeting = new CreateMeetingView();
        createMeeting.setMeetings(meetings);
        createMeeting.createNewMeeting();
        var map = new MapView({meetings: meetings});

        var pos = {lat:2};
        var friend = meetings.at(0).get('friends').at(0).move(pos);

        function testFriendMoved(friend) {
            if (friend.get('pos') !== pos) {
                throw 'Test failed';
            }
        }
    </script>
</head>
<body>

</body>
</html>
	<html>
	<head>
	<title></title>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
	<script src="http://underscorejs.org/underscore.js"></script>
	<script src="http://backbonejs.org/backbone.js"></script>
	<script>
	var Friend = Backbone.Model.extend({
	move: function(pos) {
	this.set('pos', pos);
	return this;
	}
	});
	var Friends = Backbone.Collection.extend({
	model: Friend
	});
	var Meeting = Backbone.Model.extend({
	initialize: function () {
	this.set('friends', new Friends());
	}
	});
	var Meetings = Backbone.Collection.extend({
	model: Meeting
	});

	var CreateMeetingView = Backbone.View.extend({
	setMeetings: function(meetings) {
	this.meetings = meetings;
	},
	createNewMeeting: function () {
	var friend = new Friend({name: 'Marian'});
	var meeting = new Meeting();
	meeting.get('friends').add(friend);
	this.meetings.add(meeting);
	}
	});
	var MapView = Backbone.View.extend({
	initialize: function () {
	var self = this,
	meetings = this.meetings = this.options.meetings;
	meetings.each(function (meeting) {
	var friends = meeting.get('friends');
	friends.each(function (friend) {
	friend.on('change', self.friendMoved);
	});
	});
	},
	friendMoved: function (friend) {
	testFriendMoved(friend)
	}
	});

	var meetings = new Meetings();
	var createMeeting = new CreateMeetingView();
	createMeeting.setMeetings(meetings);
	createMeeting.createNewMeeting();
	var map = new MapView({meetings: meetings});

	var pos = {lat:2};
	var friend = meetings.at(0).get('friends').at(0).move(pos);

	function testFriendMoved(friend) {
	if (friend.get('pos') !== pos) {
	throw 'Test failed';
	}
	}
	</script>
	</head>
	<body>

	</body>
	</html>