如何在点击动态生成的流星中的每个块显示窗体？ [英] How to show a form on click of a dynamically generated each block in meteor?

问题描述

如何在meteor的每个程式码块上点击动态产生的按钮来显示表单？

 < ; div id =wCard> 
 
 {{#each workflow}} 
< div class =pheader> 
< h2> {{project}}< / h2> 
< hr width =90％> 
< / div> 
< br> 
< div class =workflowcard> 
< div class =module-card> 
< div> 
< div class =card-header wfmodule> {{workflowTitle}}< / div> 
< div class =assigned-tag>分配给：< / div> 
< div class =assigned-to> {{team}}< hr>< / div> 
< div class =actions>未创建操作< / div> 
< / div> 
< div> 
到期日期
< / div> 
< / div> 
< div class =actionBtn>< button class =btn-wf stage-blue-wf button-x-small-wfid =newAction> New Action< / button> ; / div> 
 
< / div> 
 {{/ each}} 
 
< / div> 
  

这是我提交表单时动态生成的卡片。在这张卡中，我有一个新的动作按钮，当我点击动态生成卡的新动作按钮，它应该显示另一种形式。

解决方案

p>使用模板帮助和jquery为此。

示例代码：
main.html

 < template name =test> 
< div id =form1class =hidden> 
表单资料
< / div> 
 
< button id =click_button>点击以显示表单< / button> 
  

js

  Template.test.events（{
click #click_button：function（）{
 $（＃form1）.removeClass（hidden）; 
} 
  

当您添加了引导程序包（ twbs：bootstrap ）时， class =hidden b $ b

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">
                     <h2>{{project}}</h2>
                     <hr width="90%">
                </div>
                     <br>
                 <div class="workflowcard">
                 <div class="module-card">
                   <div>
                    <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>
                    </div>
                    <div>
                        due date
                    </div>
                </div>
                 <div class="actionBtn"><button class="btn-wf stage-blue-wf button-x-small-wf" id="newAction">New Action</button></div>

            </div>
                {{/each}}

        </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
     </div>

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

In javascript file- main.js

Template.test.events({
   "click #click_button" : function() {
         $( "#form1" ).removeClass( "hidden");
}

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

这篇关于如何在点击动态生成的流星中的每个块显示窗体？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！