模态可以在foreach里面吗？答案

【问题标题】：Can modals be inside foreach?模态可以在foreach里面吗？
【发布时间】：2016-03-07 01:55:56
【问题描述】：

此表为推荐学生列表，点击“查看详情”时，“推荐详情（文本格式）”应以模态形式显示...我在第一行没有问题推荐细节，我的问题是下一个推荐细节只显示第一个推荐细节..

<table class="table no-margin">
   @foreach($faculty->recommendations as $student)
     <tr>
       <td class="text-muted" valign="middle"><a href="{{ URL::to('/', $faculty->user->id) }}"> Name </a></td>

     <td align="right"><button type="button" class="btn btn-primary btn-view" data-toggle="modal" data-target="#dialog-box" >View Details</button>
          <div class="modal fade" id="dialog-box" role="dialog" aria-hidden="true">
            <div class="modal-dialog" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <h2>Recommendation Details</h2>
                </div>
                <div class="modal-body">
                  <div class="form-group">           
                    <p class="jobpost-p">{{ $faculty->pivot->recommendation_details }}</p>
                  </div>
                </div>
             </div>
           </div>
        </div> <!--Modal close-->
   @endforeach
</table>

【问题讨论】：

每个项目的目标和 id 应该不同，但你最好创建一个模式并附加自定义数据 OnClick 否则你的视图中有很多无用的重复 html 会导致事情发生跑得慢。

标签： javascript php html laravel laravel-5

【解决方案1】：

是的，他们可以。 但是，您需要确保每个模式的触发元素具有唯一的 data-target 属性，并且每个模式的 id 属性共享相同的唯一值。

一个简单的解决方案是使用您正在迭代的每个数组中存在的唯一值。例如，如果 $student 的值具有唯一的 id，您可以将其附加到每个模态 id。

【讨论】：

【解决方案2】：

可以，但这不是最佳做法。如果您有一个包含 25 个项目的列表，那么您将有 25 个模态。大量无用的html。我认为一个好方法是创建一个包含您需要的所有字段的单一模式，当您单击一个项目时，使用 javascript 使用它的数据填充模式。用 vuejs 几分钟就能搞定

【讨论】：