sailu sailu - 3 months ago 10
CSS Question

show hidden part of the dynamic card on button click in meteor

I have created a card dynamically and hide some part of the content by taking it in another template and called on each block and it's working fine. Now how to display the hidden part on button click?

Here I am attaching my code.

<div id="newActionCard">
{{#each newaction}}
<div class="workflowcard">
<div class="module-card">

<div class=" assigned-team">{{team}}</div>
<div class=" newaction-name">{{action_title}}</div><hr>
<div class="description">{{description}}</div>
<div class=" due-on">Due on:{{d_date}}</div><hr>
<div class="subcontent">
<div class="action"> {{actioncardsubcontent}} </div>
</div>
</div>



<div class="btn-box newaction">
<button type="button" class="btn btn-info" id="cancelsub">New Action</button>
<button type="submit" class="btn btn-info" id="createbtnsub">Show Options</button>
</div>
</div>

{{/each}}
</div>




</template>

<template name="actioncardsubcontent">
<div class="subcontent">
<div class="modulepath">{{module_list}}</div>
<div class="linkto">Linked To: {{link}}</div>
<div class="description">{{description}}</div>
</div>
</template>

Answer
  1. You are including the template incorrectly. It should be {{> actioncardsubcontent}}

  2. To link up with a button to hide/show, follow this

  3. Please share the js script as well with helpers and events if the above steps don't solve the issue.

Comments