Backbone.js 从木偶子视图重新渲染同级视图
我有一个非常标准的木偶项目视图和复合视图,如下所示:Backbone.js 从木偶子视图重新渲染同级视图,backbone.js,marionette,Backbone.js,Marionette,我有一个非常标准的木偶项目视图和复合视图,如下所示: List.LessonType = Marionette.ItemView.extend({ template: "lesson_types/list/lesson_type", tagName: "tr", triggers: { "click #edit-lesson-type" : "edit:lesson:type:clicked" } }); List.LessonType
List.LessonType = Marionette.ItemView.extend({
template: "lesson_types/list/lesson_type",
tagName: "tr",
triggers: {
"click #edit-lesson-type" : "edit:lesson:type:clicked"
}
});
List.LessonTypes = Marionette.CompositeView.extend({
template: "lesson_types/list/lesson_types",
itemView: List.LessonType,
itemViewContainer: "tbody"
});
在我的控制器中,我有:
lessonTypes: function( lessonTypes ) {
var lessonTypesView;
lessonTypesView = this.getLessonTypesView( lessonTypes );
lessonTypesView.on( "childview:edit:lesson:type:clicked", function( child, args ) {
// a whole bunch of jquery
});
App.lessonRegion.show( lessonTypesView );
},
getLessonTypesView: function( lessonTypes ) {
return new List.LessonTypes({
collection: lessonTypes
});
}
所有这些JQuery基本上通过向td
添加contenteditable=“true”
使childview的el(这是一个表行)可编辑
单击一行时,我希望恰好处于可编辑状态的任何其他表行返回到其原始的不可编辑状态。我可以在JQuery执行它的操作之前,以某种方式重新呈现兄弟视图,或者让整个集合重新呈现吗?事实证明这并不难。我在控制器中添加了以下内容:
lessonTypes: function( lessonTypes ) {
var lessonTypesView;
lessonTypesView = this.getLessonTypesView( lessonTypes );
lessonTypesView.on( "childview:edit:lesson:type:clicked", function( child, args ) {
var model, collection;
model = args.model;
collection = lessonTypesView.collection;
collection.each( function( mod ) {
if( mod.id !== model.id ) {
mod.trigger( "refresh" );
}
}, this );
// a whole bunch of jquery
});
App.lessonRegion.show( lessonTypesView );
},
自定义事件强制视图重新渲染。他认为:
List.LessonType = App.Views.ItemView.extend({
template: "lesson_types/list/lesson_type",
tagName: "tr",
triggers: {
"click #edit-lesson-type" : "edit:lesson:type:clicked"
},
modelEvents: {
"refresh" : "render" // listening to custom event set in the controller
}
});
如果有更好的方法,我很想听听