我正在使用Backbone.js显示人员及其数据的列表。
每个人都有自己的<div>
。 div由_.template
生成,并包含<input>
字段以显示此人的数据,以便进行调整。
还有一个class=".save"
的按钮。在我看来,我有一个绑定此按钮的功能。我正在寻找获取属于该模型的<input>
中div
- 代码值的最佳方法。
这是我的方法,但我想知道是否有更好。在我的模板中,我基于模型的ID动态地为DOM元素分配了ID。我使用相同的逻辑来查找视图中的元素。
TEMPLATE
<input value="<%=name%>" id="name_<%=id%>"/>
<input value="<%=age%>" id="age_<%=id%>"/>
<input value="<%=address%>" id="address_<%=id%>"/>
<button class=".save">Save</button>
查看
events:{
"click .save":"savePerson"
},
savePerson: function(){
this.model.set({
name: $("#name" + this.model.id).val(),
address: $("#address_" + this.model.id).val(),
age: $("#age_" + this.model.id).val()
});
this.model.save();
}
答案 0 :(得分:7)
如果每个人都是具有自己模板的不同视图实例,则只需定义视图模板选择器的范围:
TEMPLATE
<form id="<%-id%>">
<input value="<%-name%>" name="name"/>
<input value="<%-age%>" name="age"/>
<input value="<%-address%>" name="address"/>
<button class=".save">Save</button>
</form>
查看
events:{
"click .save":"savePerson"
},
savePerson: function(){
this.model.set({
name: this.$("input[name='name']").val(),
age: this.$("input[name='age']").val(),
address: this.$("input[name='address']").val()
});
this.model.save();
}
否则,如果您在同一个模板/视图实例中有很多人(不太好),只需捕获当前人的身份var personId = this.$("#"+this.model.id)
,就可以使用上面的personId
内部选择器。
PS:我使用<%-value%>
代替<%=value%>
来插入此值,并将其转换为HTML。