<template name="childcardstmpl">
<div class="cards-list child-cards-list">
{{#each selected_children id}}
<input type="text" id="{{_id}}" class="card-input childtitle " autocapitalize="none" autocorrect="off" value="{{cardTitle}}">
</div>
{{/each}}
<input type="button" id="" class="addCardButton createSiblingCard {{id}}" value="Add">
</div>
{{#if isSelected_have_children id}}
{{#with selected_child id}}
{{> childcardstmpl id=_id}}
{{/with}}
{{/if}}
</template>
I have this recusrion template, which is working fine and rendering whatever I want, I’ve attached events to template
'click .createSiblingCard':function(e,tmpl){
console.log(this);
}
Suppose that recusrion templates renders
a > b > c > d
each time with the button
<input type="button" id="" class="addCardButton createSiblingCard {{id}}" value="Add">
If I click on button in a, the click event is firing 1 time
If I click on button in b, the click event is firing 2 times
If I click on button in c, the click event is firing 3 times
I want the button event to be fired only once no matter what place I’m in(a or b or c)
How to do that? What is the error in my code?
Is there any other way to rewrite my recurion template, so the event only occure once.