Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Isi data dari table tidak muncul di dalam modal
Selamat malam.. saya mau tanya.![](-pasang url gambar disini(format .png atau .jpg)-) Kenapa ya isi dari tabel nya tidak muncul didalam body modal? Apa ada kodingan yang salah? Mohon bantuannya ya.. Berikut ini koding untuk modalnya :
<html>
<head>
<title>Warteg Online</title>
<link type="text/css" rel="stylesheet" href="css/materialize.min.css"/>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<style>
*{
padding:0px;
margin:0px;
}
.navbar-header{
position:fixed;
height:20%;
}
.navbar-header a{
font-size:16px;
}
.col-md-3{
background-color:#330000;
color:#FFFFFF;
margin-top:-18px;
padding-top:0px;
height:90%;
overflow:scroll;
}
.menu img{
margin:5%;
width:250px;
height:145px;
position:relative;
}
.menu p{
position:absolute;
color:#000000;
font-size:24px;
}
.col-md-9{
margin-top:-18px;
background-color:#330000;
height:90%;
overflow:scroll;
}
.card{
width:250px;
float:left;
margin-top:3%;
margin-right:3%;
}
</style>
<!-- Tampilan Header-->
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<p class="navbar-brand">Warteg Bahari</p>
<ul class="nav navbar-nav">
<li><a href="home_nasi.php">Nasi</a></li>
<li class="active"><a href="home_sayur.php">Sayur Mayur</a></li>
<li><a href="home_nabati.php">Lauk Nabati</a></li>
<li><a href="home_hewani.php">Lauk Hewani</a></li>
<li><a href="home_gorengan.php">Gorengan</a></li>
<li><a href="home_minuman.php">Minuman</a></li>
</ul>
</div>
</nav>
<!-- -->
<!-- Tampilan Body Home Sayur -->
<div class="container-fluid">
<div class="row">
<div class="col-md-9">
<form action="home_sayur.php" method="get">
<?php include 'koneksi.php';
$pilih=mysql_query("select *from daftar_menu where nm_menu LIKE 'Sayur%'")or die(mysql_error());
while($fpilih=mysql_fetch_array($pilih)){ ?>
<div class="card 1">
<img src="gambar/<?php echo $fpilih['gambar']; ?>" style="width:250; height:145;">
<div class="container">
<input type="hidden" value=""
<h4><b><?php echo $fpilih['nm_menu']; ?></b></h4>
<p>Rp <?php echo $fpilih['hrg_menu']; ?></p>
<input type="hidden" name="id" value="<?php echo $result['id']; ?>">
<a href="#edit_modal" data-toggle='modal' data-id='<?php echo $data['id']; ?>'><i class="btn btn-primary">Lihat Rincian</i></a>
</div>
</div>
</form>
<?php } ?>
</div>
<!-- Untuk Modal edit -->
<div class="modal fade" id="edit_modal" role="dialog">
<div class="modal-dialog" role="document">
<!-- Konten dari modal -->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title"><center>Detail Menu</center></h4>
</div>
<div class="modal-body">
<div class="hasil-data"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Keluar</button>
</div>
</div>
</div>
</div>
<!-- Akhir Untuk modal edt -->
<div class="col-md-3">
<h3><center>Menu Saya</center></h3>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.data').DataTable();
});
$(document).ready(function(){
$('#edit_modal').on('show.bs.modal', function (e) {
var idx = $(e.relatedTarget).data('id');
//menggunakan fungsi ajax untuk pengambilan data
$.ajax({
type : 'post',
url : 'detail_menu.php',
data : 'idx='+ idx,
success : function(data){
$('.hasil-data').html(data);//menampilkan data ke dalam modal
}
});
});
});
</script>
</body>
</html>
dan ini untuk detail isi dari modalnya :
<?php
include "koneksi.php";
if($_POST['idx']) {
$id = $_POST['idx'];
$sql = mysql_query("SELECT * FROM daftar_menu WHERE id = '$id'")or die("gagal!");
while ($result = mysql_fetch_array($sql)){
?>
<input type="hidden" name="id" value="<?php echo $result['id']; ?>">
<div class="form-group">
<h1><?php echo $result['nm_menu']; ?></h1>
</div>
<button class="btn btn-primary" type="submit">Update</button>
<?php } }
?>
Ini adalah tampilan saat program dijalankan :
7 Jawaban:
untuk parameter data di ajax emang ngisinya begitu ya gan. soalnya kalau saya biasanya begini gan:
data :{idx : idx},
coba echo $_POST['idx'] diluar if. Kalau ada berarti di if nya. Coba pakai isset aja kaya gini:
if(isset($_POST['idx'])) {
Cob di ubah outputnya dengan menggunakan
json_encode()
lalu di scriptnya:
$(document).ready(function(){
$('#edit_modal').on('show.bs.modal', function (e) {
var idx = $(e.relatedTarget).data('id');
//menggunakan fungsi ajax untuk pengambilan data
$.ajax({
type : 'post',
url : 'detail_menu.php',
data : 'idx='+ idx, //Misalkan dah pake json_encode(), line ini bisa dilepas
dataType: 'JSON',
success : function(data){
$('.hasil-data').html(data.nama_field_pada_table);//menampilkan data ke dalam modal
}
});
});
});
@zergz kosong json_encode nya ditaro di kodingan isi modal gan?
Diletakkan di detail_menu.php Misalkan macam gini:
echo json_encode($result);
untuk echo-nya sendiri disesuaikan dgn query databasenya
ternyata salah disaya gan @zergz @devio.. ada nama variabel yg beda.. makasih ya udh dibantu..
Tanggapan
salah nya dimana ya gan ? saya gak tampil juga nih