我尝试使用backbone.stickit库将表单输入绑定到模型,但似乎无法使模型正确更新。
keyup事件似乎工作正常,如果我使用" onSet"我可以看到值的变化。回调显示它:
bindings: {
'#firstName': {
observe: 'firstName',
onSet: function(val, options) {
$('#output').html(val);
}
}
}
这是我的代码(Run it on jsfiddle):
HTML
<div id="view">
<form name="form" id="form">
<input id="firstName" type="text"/>
<input type="submit" id="submit"/>
</form>
<div id="output"></div>
</div>
的JavaScript
var app = {
Model: Backbone.Model.extend({
firstName: 'test'
}),
View: Backbone.View.extend({
el: "#view",
initialize: function(){
this.model = new app.Model();
this.render();
},
bindings: {
'#firstName': 'firstName'
},
render: function(){
this.$el.html( this.template );
this.stickit();
},
events: {
"submit #form": "submitForm"
},
submitForm: function(e) {
e.preventDefault();
$('#output').html('output:'+this.model.firstName);
}
})
};
var view = new app.View();
答案 0 :(得分:0)
获取模型属性的方法通常不是通过将属性名称作为对象属性访问,而是通过您this.model.firstName
的方式访问。就个人而言,我知道很少有这种实施的案例。所谓的正确方法是使用get
方法:
this.model.get("firstName")
。
这将返回当前模型值。
我通常为我使用的每个模型定义getter和setter,所以我会执行以下操作:
getFirstName: function(){
return this.get("firstName");
}
只是看起来更好,更容易“#34;轻松的眼睛&#34; :)(但完全不是必须的)
以下是您的小提琴的更新:http://jsfiddle.net/srhfvs8h/1/