marionettejs - Get on which element event is generated

Question

I have defined LayoutView & inside that region. For one region, I attached CompositeView. In CompositeView section I added ui block & trigger block like

   ui: {
      checkbox: '#DivGrp1 input[type=checkbox]' 
   }  

    triggers: {
      'change @ui.checkbox': 'chk:clicked'
    },

In parent class, I am listening the event like

childEvents: {
  'chk:clicked':function(e){
   // e is referring to view & not checkbox
  }
}

I want to access the input element on which event is raise. Here which checkbox is been checked or unchecked.

These checkboxes are dynamic.

Thanks Aniruddha

Answer 1

Short answer: Access DOM in the view that owns the element. Then manually trigger event using it's trigger method passing the result of operation required by parent view.

I'm not marionette expert, but generally speaking it is not a good idea to directly access element's of one view from other views.

Do the operations that requires DOM access in the child view itself, if you want access to the event object, use the events attribute. Perform the operations and then trigger the event parent view is listening to using trigger() method.

Here is an: example from the official docs that has a similar structure.

If you MUST have direct access to the element, then you can pass it's reference as the argument in trigger() method. But this isn't recommended.