I want to display data from database into modal. I have a table, has 12 fields. One of them is titled articles that have many characters. So it will take up much space if shown in the table. So, I want to display the record from the article field into modal. This is my code:
<?php
error_reporting(0);
mysql_connect("localhost","root","");
mysql_select_db("hellomedan");
$que = "SELECT * FROM `wisata`";
$q = mysql_query($que);
$no = 1;
while ($qq = mysql_fetch_array($q)) {
?>
<tr style="background:#D79407;">
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><?php echo $no ?></td>
<td style="border:1px solid #999;padding:4px 8px;"><?php echo $qq['nama'] ?></td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><img src="img/ic_search_white_24dp_1x.png"></td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><?php echo $qq['rating'] ?></td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><?php echo $qq['jenis'] ?></td>
<td style="border:1px solid #999;padding:4px 8px;"><?php echo $qq['alamat'] ?></td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><?php echo $qq['telepon'] ?></td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><?php echo $qq['jambuka'] ?></td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><?php echo $qq['jamtutup'] ?></td>
<td style='text-align:center; border:1px solid #999;padding:4px 8px; cursor:pointer;' data-id=".$qq['id'].">
<div id="id01" class="modal">
<div class="container" style="background-color:#FFBD30">
<button style="margin-top: 0px; margin-left:0px; width:100px; float:right;" type="button" onclick="document.getElementById('id01').style.display='none'" class="tombol_wisata">Tutup</button>
<p style="text-align: justify;padding-top:70px"><?php echo $qq['artikel'] ?></p>
</div>
</div>
<img onclick="document.getElementById('id01').style.display='block'" src="img/ic_search_white_24dp_1x.png">
</td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;"><a href="<?php echo $qq['link'] ?>"><img src="img/ic_place_white_24dp_1x.png"></a></td>
<td style="text-align:center; border:1px solid #999;padding:4px 8px;">
<a style="text-decoration:none;" href="edit_wisata.php?id=<?php echo $qq['id']; ?>"><img src="img/ic_mode_edit_white_24dp_1x.png"></a>
<a style="text-decoration:none;" href="php/proses_delete_wisata.php?id=<?php echo $qq['id']; ?>"><img src="img/ic_delete_white_24dp_1x.png"></a>
</td>
</tr>
<?php $no++; } ?>
The problem is, when I click the magnifying glass button, modal displays the same file. Modal displays data from the first field on all the magnifying glass buttons. How to solve it? Is my code correct? Because I made up my own code :(