sailu sailu - 1 month ago 4x
CSS Question

How to show a form on click of a dynamically generated each block in meteor?

How can I show a form on click of a dynamically generated button on each block of the code in meteor?

<div id="wCard">

{{#each workflow}}
<div class="pheader">
<hr width="90%">
<div class="workflowcard">
<div class="module-card">
<div class="card-header wfmodule">{{workflowTitle}}</div>
<div class="assigned-tag">Assigned To:</div>
<div class="assigned-to">{{team}}<hr></div>
<div class="actions">No Actions Created</div>
due date
<div class="actionBtn"><button class="btn-wf stage-blue-wf button-x-small-wf" id="newAction">New Action</button></div>



This the card dynamically generating when I submit a form. In this card I have a new action button, when I click on new action button of dynamically generated card it should display another form.


Use Template helpers and jquery for this.

Example code: main.html

<template name="test">
     <div id="form1" class="hidden">
        Form Stuff

     <button id="click_button">Click to Show form</button>

In javascript file- main.js{
   "click #click_button" : function() {
         $( "#form1" ).removeClass( "hidden");

The class="hidden" will work when you have bootstrap package (twbs:bootstrap) added.