模態多重圖像顯示不正確laravel 5.3

我使用引導模式來顯示我的所有圖像，但只有一個圖像顯示在我的laravel 5.3項目我無法弄清楚如何修復它下面的代碼只有第一個圖像顯示如果我在代碼的結尾使用@endforeach，那麼只顯示最後一張圖片。模態多重圖像顯示不正確laravel 5.3

<div class="col-lg-12"> 
@foreach($prizebond_images as $prizebond_image) 
    <div class="col-lg-4">         
     {!! Html::image('images/'.$prizebond_image->prizebond_image,'a picture',['class'=>'img-thumbnail img-responsive','data-target'=>"#myModal",'data-toggle'=>'modal']) !!} 
     <p class="text-success">{{$prizebond_image->prizebond_image_rank}}</p> 
    </div> 
@endforeach 

</div> 
<!-- Modal --> 

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog" role="document"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
        <span aria-hidden="true">&times;</span> 
       </button> 
       <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
      </div> 
      <div class="modal-body" width="auto" height="auto"> 
       {!! Html::image('images/'.$prizebond_image->prizebond_image,'a picture',['class'=>'img-thumbnail img-responsive']) !!} 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
       <button type="button" class="btn btn-primary">Save changes</button> 
      </div> 
     </div> 
    </div> 
</div>

來源

2017-01-02 golam rabbani

您需要在循環內部放置模態窗口代碼。另外，您需要爲每個模式和鏈接創建唯一ID，請使用the loop variable。例如：

@foreach($prizebond_images as $prizebond_image) 
    ....  
    {!! Html::image(.... 'data-target' => "#myModal".$loop->index, 'data-toggle'.... 
    .... 
    <!-- Modal --> 
    <div class="modal fade" id="myModal{{ $loop->index }}" tabindex="-1".... 
    .... 
@endforeach

來源

2017-01-02 10:02:51

非常感謝它的工作。 –

模態多重圖像顯示不正確laravel 5.3

回答

相關問題