2016-05-12 58 views
0

节点使用EJS表示应用程序。许多按钮在html表中触发一个模式

我在创建一个表 - 每个单元格都有一个按钮来触发一个模式。此代码是在for循环:

<td> 
      <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
       <div class="modal-dialog"> 
        <div class="modal-content"> 
         <!-- Header--> 
         <div class="modal-header"> 
          <button type="button" class="close" data-dismiss="modal"> 
           <span aria-hidden="true">&times;</span> 
           <span class="sr-only">Close</span> 
          </button> 
          <h4 class="modal-title" id="myModalLabel">Catalog Numbers</h4> 
         </div> 
         <!-- Body --> 
         <div class="modal-body"> 
          <% for(var j = 0; j < user.notifications.length; j++) { %> 
          <%= user.notifications[j] %> 
          <% } %> 
         </div> 
         <!-- Footer --> 
         <div class="modal-footer"> 
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
         </div> 
        </div> 
       </div> 
      </div> 

      <div class="btn-group" role="group" aria-label="..."> 
       <!-- Button trigger modal --> 
       <button class="btn btn-primary" data-toggle="modal" data-target="#myModal">View Subscribed Products </button><br><br> 
      </div> 
      </td> 

每一件事加载罚款,呈现的HTML显示,每个单元都有它自己的模式有它自己的数据,但每个按钮触发myModal和他们都称为myModal所以每一个按钮从第一个单元格加载模态。

有没有办法动态创建div idmyModal1,myModal2等?

我已经试过

<div class="modal fade" id="<%=user.id%> ...> 

我应该这样做另一种方式?

+0

另一种方式是(HTTP [基于触发按钮改变模式内容]: //getbootstrap.com/javascript/#modals-related-target)。 –

+0

感谢您的链接,如果我正确地阅读它(我是新手),那么我可以将该脚本放在'

相关问题