Question

我有一个由项目视图组成的复合视图。我需要捕获项目视图的事件，我想要捕获的是特定项目视图捕获，因为我在项目视图中单击按钮时呈现弹出模式。模态需要包含单击它的项目的详细信息。发生的事情是，如果我将事件捕获放在任一项或项目或复合视图中，并带有按钮的查询选择器（此按钮具有隐藏的项目ID范围），它总是选择第一项。

听起来它做得对，因为复合视图中的项目视图重复不会改变按钮的id（即使隐藏的跨度具有不同的id）。

Quesiton是如何使用属性捕获来捕获特定项目事件的。

以下代码：

ItemView控件：

    var regItemView = Marionette.ItemView.extend({
    template: ProgramRegistraionMainItemView,
    tagName: 'div',
    className : 'accordion_in',
    events : {
     'click #subbtn' : function () {
           var prgid = $('#regid').html();
           var rate = $('#rate').html();         MyApp.mainregion.currentView.appcontent.currentView.maincontent.currentView.contentregion1.currentView.prgregmainmodal.show(new ProgramRegistrationModalView({selectedprgid : prgid,rate: rate}));
      }   

    }

});

复合视图

   var RegistrationView = Marionette.CompositeView.extend({
   itemView : regItemView,
   itemViewContainer: "#mainaccordion",
   template : ProgramRegistraionMainCollectionView,
   initialize : function(programcollection)
   {
      this.collection = programcollection;
      this.model =null;
    },
   model : this.model,
   collection : this.collection, 
   showAccord : function () {
            //console.log("In Accodian show"+$("#mainaccordion").html()); 
            $("#mainaccordion").smk_Accordion({
            showIcon: true, // Show the expand/collapse icons.
            animation: true, // Expand/collapse sections with slide aniamtion.
            closeAble: true, // Closeable section.
            slideSpeed: 200, // the speed of slide animation.
            closeOther : false
        });
   }

目标是获取所点击项目的程序ID（通过项目视图呈现）。

Answer 1

从您的regItemView事件哈希看，问题是使用jQuery事件处理程序的html id。 id在整个页面中应该是唯一的，但是你已经为每个ItemView重复了它。将其更改为类或元素名称（如果您每个项目视图只有一个）：

var regItemView = Marionette.ItemView.extend({
    template: ProgramRegistraionMainItemView,
    tagName: 'div',
    className : 'accordion_in',
    events : {
        'click button' : 'showModal'
    },
    showModal: function () {
        // Show modal somehow
        // you can access the model in here as this.model
    }
});

Marionette将事件处理程序上下文设置为项视图，因此您可以简单地将模型作为this.model访问。这比在HTML中添加data-id标记以检索模型更好。

木偶复合物品查看捕获

1 个答案: