<?php
// DB credentials.
define('DB_HOST','localhost');
define('DB_USER','root');
define('DB_PASS','');
define('DB_NAME','modaldb');
// Establish database connection.
try
{
$dbh = new PDO("mysql:host=".DB_HOST.";dbname=".DB_NAME,DB_USER, DB_PASS,array(PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES 'utf8'"));
}
catch (PDOException $e)
{
exit("Error: " . $e->getMessage());
}
?>
index.php
<?php
session_start();
error_reporting(0);
include "config.php";
?>
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>How to display data in modal</title>
<!--Bootstrap -->
<link rel="stylesheet" href="css/bootstrap.css" type="text/css">
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
</head>
<body>
<div class="container">
<div> </div>
<h3>How to display Mysql data in modal</h3>
<div class="row mt-6">
<table id="" class="table table-bordered">
<thead>
<tr>
<th class="text-center">No</th>
<th>Product Name</th>
<th class="text-center">Product Category</th>
<th class="text-center">Product Price</th>
<th class="text-center">Posting Date</th>
<th class=" text-center">Action</th>
</tr>
</thead>
<tbody>
<?php
$sql="SELECT * from tblproducts ORDER BY id DESC";
$query = $dbh -> prepare($sql);
$query->execute();
$results=$query->fetchAll(PDO::FETCH_OBJ);
$cnt=1;
if($query->rowCount() > 0)
{
foreach($results as $row)
{
?>
<tr>
<td class="text-center"><?php echo htmlentities($cnt);?></td>
<td><?php echo htmlentities($row->ProductName);?></td>
<td class="text-center"><?php echo htmlentities($row->CategoryName);?></td>
<td class="text-center"><?php echo htmlentities($row->ProductPrice);?></td>
<td class="text-center"><?php echo htmlentities(date("d-m-Y", strtotime($row->PostingDate)));?></td>
<td class=" text-center">
<a href="#" class=" edit_data5 btn btn-sm btn-primary" id="<?php echo ($row->id); ?>" title="click to view">View</a>
</td>
</tr>
<?php
$cnt=$cnt+1;
}
} ?>
</tbody>
</table>
</div>
<!-- start modal -->
<div id="editData5" class="modal fade">
<div class="modal-dialog modal-md">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">View product details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="info_update5">
<?php @include("view_product.php");?>
</div>
<div class="modal-footer ">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
</div>
<!-- end modal -->
</div>
<!-- Loading Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap-select.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script>
<script src="js/dataTables.bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(document).on('click','.edit_data5',function(){
var edit_id5=$(this).attr('id');
$.ajax({
url:"view_product.php",
type:"post",
data:{edit_id5:edit_id5},
success:function(data){
$("#info_update5").html(data);
$("#editData5").modal('show');
}
});
});
});
</script>
</body>
</html>
view_product.php
<?php
session_start();
error_reporting(0);
include('config.php');
?>
<div class="card-body">
<?php
$eid=$_POST['edit_id5'];
$sql="SELECT * from tblproducts where tblproducts.id=:eid";
$query = $dbh -> prepare($sql);
$query-> bindParam(':eid', $eid, PDO::PARAM_STR);
$query->execute();
$results=$query->fetchAll(PDO::FETCH_OBJ);
if($query->rowCount() > 0)
{
foreach($results as $row)
{
?>
<h4 style="color: blue">Product Information</h4>
<table border="1" class="table table-bordered">
<tr>
<th>Product Name</th>
<td>
<?php echo $row->ProductName;?>
</td>
</tr>
<tr>
<th>Category Name</th>
<td><?php echo $row->CategoryName;?></td>
</tr>
<tr>
<th>Category Price</th>
<td><b>$</b> <?php echo $row->ProductPrice;?></td>
</tr>
<tr>
<th>Posting Date</th>
<td><?php echo htmlentities(date("d-m-Y", strtotime($row->PostingDate)));?></td>
</tr>
</table>
<?php
}
} ?>
</div>
Download
