Parent ._id via child click event

Lets say I have the following

{{#each person}}

{{person}}
    
    {{#each details}}
    <button> {{person_mobile_number}} </button>
    {{/each}}

{{/each}}

How can I get the ._id from the parent helper (person) when I trigger a click event in child via the button? I would like to avoid using HTML IDs and classes as much as possible, so code stays clean

Assuming you are clicking the button:

{{#each person}}
  {{person}}
    {{#each details}}
      <button data-parentid="{{../_id}}"> {{person_mobile_number}} </button>
    {{/each}}
{{/each}}

Template.people.events({
  'click button' (e, i) {
    let parentId = e.currentTarget.dataset.parentid;
  }
});

Ok, so this is the only way :sunglasses:

Thanks!

For example, Template.parentData(0) is equivalent to Template.currentData(). Template.parentData(2)
is equivalent to {{ā€¦/ā€¦}} in a template.

You need Template.parentData(1).

Haha, not the only way, Iā€™m sure. For instance:

{{#each person}}
  {{person}}
    {{#each details _id}}
      <button> {{person_mobile_number}} </button>
    {{/each}}
{{/each}}
Template.people.helpers({
  details (parentId) {
    return _.map(details, function (detail) {
      detail.parentId = parentId;
      return detail;
    });
  }
});

Then your parentId would be accessible as a property of your details.

@vigorwebsolutions
Latter one is quite exactly what I was looking for :wink:

1 Like