var FooView = Backbone.View.extend({
bindings: {
'#firstName': 'firstName',
'#lastName': 'lastName',
'#fullName': {
observe: ['firstName', 'lastName'],
onGet: function (values) {
return values[0] + ' ' + values[1];
}
}
},
initialize: function () {
},
render: function () {
this.stickit();
return this;
}
});
var fooModel = new Backbone.Model();
fooModel.set({
firstName: 'Taro',
lastName: 'Yamada'
});
var fooView = new FooView({
model: fooModel,
el: $('#foo')
});
fooView.render();
<div id="foo">
<p>First name:<input id="firstName"/></p>
<p>Last name:<input id="lastName"/></p>
<h2>Hello, <span id="fullName"></span>!</h2>
</div>
External resources loaded into this fiddle: