如何在 Laravel 中循环引导模式？答案

【问题标题】：How to loop bootstrap modal in Laravel?如何在 Laravel 中循环引导模式？
【发布时间】：2019-01-14 13:56:07
【问题描述】：

我正在尝试循环我的模式。此模态用于显示用户的二维码。但我只得到第一个值。

这是我的模态。

@foreach($siswas as $siswa)
<div class="modal fade" id="qrmodal" >
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title"> QR </h4>
        <button type="button" class="close" data-dismiss="modal">
          &times;
        </button>
      </div>

      <div class="modal-body">
          <div class="form-group centered" id="QR">
            {!!QrCode::size(200)->generate($siswa->nis)!!}
          </div>
      </div>

      <div class="modal-footer">
        <button type="submit" class="btn btn-primary">Print</button>
        <button type="button" data-dismiss="modal" class="btn btn-danger">Close</button>
      </div>
    </div>
  </div>
</div>
@endforeach

【问题讨论】：

页面上的所有 id 必须是唯一的。您正在创建具有相同 ID 的多个模式。将 ID 更改为每个循环中唯一的值，您可以使用 qrmodal 作为类名。
<div class="modal fade" id="qrmodal" > 确保每个模式都有一个唯一的 id。 <div class="modal fade" id="qrmodal_DYNAMICVALU" >

标签： php laravel loops foreach modal-dialog

【解决方案1】：

您的问题是 id 不是唯一的。但这是一个不好的方法。您应该只有一个模式，并且取决于单击的按钮，您应该加载内容。

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">Open modal for @mdo</button>

$('#exampleModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
  var recipient = button.data('whatever') // Extract info from data-* attributes
  // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
  // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
  var modal = $(this)
  modal.find('.modal-title').text('New message to ' + recipient)
  modal.find('.modal-body input').val(recipient)
})

【讨论】：