How to display an image in Bootstrap modal window

I have a table where I save 6 data between them a field where the path of a saved image is saved on the server.

I have a button inside the page called details where clicking it shows a modal window with the information of this, but I do not know how to display the image that is saved in the database only shows me the name of the image.

 0
Author: Shaz, 2016-07-27

2 answers

Assuming you use bootstrap 3 (it should work similar in 2 and 1), then, just include Inside The modal body an html tag of images ' img 'and by javascript or php (I leave it to your choice) you assign the path of the image in the porpiedade 'src', a simple example would be like:

<div id="myModal" class="modal fade" role="dialog">  
<div class="modal-dialog">
    <div class="modal-content">      
        <div class="modal-header">        
            <button type="button" class="close" data-dismiss="modal">×</button>        
            <h4 class="modal-title">Modal Header</h4>      </div>      
        <div class="modal-body"><img src="http://static.batanga.com/sites/default/files/styles/full/public/universo-observable-en-una-imagen-3.png?itok=sBpiT7gx" class="img-rounded" alt="Cinque Terre" width="304" height="236" />   </div>      
        <div class="modal-footer">        
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>     
        </div>  
    </div>  
</div>

 1
Author: Obelisc, 2016-07-27 19:09:18

Try the following code (PHP)

<img src="<?php echo $ruta; ?> ">

Otherwise (JS)

<img src=ruta>
 0
Author: Pak Lei, 2016-07-27 18:59:12