Ajax undefined id PHP post
Question
So, i have two files index.php and edit.php
Mainly i want to send and get id variable from index.php and print echo in edit.php for learning ajax, but i've tried every single tutorial in internet, i follow them, unfortunately i cant figure out why i get this error, by the way here's the code :
Index.php
<?php
include ('connection.php');
$query ="SELECT * FROM buku ORDER BY id ASC";
$result = mysqli_query($con, $query);
?>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<title></title>
</head>
<body>
<table>
<thead>
<tr>
<td>Id</td>
<td>No Buku</td>
<td>Nama Buku</td>
<td>Tahun Terbit</td>
<td>Action</td>
</tr>
</thead>
<?php
while($row = mysqli_fetch_array($result))
{ ?>
<tr>
<td><?php echo $row['id'] ?></td>
<td><?php echo $row['nobuku'] ?></td>
<td><?php echo $row['namabuku'] ?></td>
<td><?php echo $row['tahunterbit'] ?></td>
<td><button type="buton" class="edit" id="<?php echo $row['id'] ?>">Edit</button>
</td>
</tr>
<?php
};
?>
</table>
<div class="tampil"></div>
<script type="text/javascript">
$(document).on('click', '.edit', function(){
var id = $(this).attr("id");
$.ajax({
type:"post",
url:"edit.php",
data:{id:id},
success:function(data){
$('.tampil').load("edit.php");
}
});
});
</script>
</body>
</html>
</body>
</html>
and here's the edit.php
<?php
include ('connection.php');
$id = $_POST['id'];
echo $id;
?>
issue is, when i clicked the button id=edit, in my index.php always sending undefined id, it means the id variable is not sending correctly, but when i edit the ajax part into alert (id), it printed the id variable, so the problem is i dont have idea why it cannot send id variable into edit.php page.
Thanks for your help
2 answers
solution1
1 2018-06-30 10:22:41
The problem is that you are first loading the edit.php with ajax and sending it the id. But then, after you have loaded the ajax request you load edit.php again, this time without the id.
You already get the response in the ajax request, you only have to use it.
<script type="text/javascript">
$(document).on('click', '.edit', function(){
var id = $(this).attr("id");
$.ajax({
type:"post",
url:"edit.php",
data:{id:id},
success:function(data){
$('.tampil').html(data);
}
});
});
</script>
solution2
0 2018-06-30 10:07:23
change edit.php to this
<?php
include ('connection.php');
if (isset($_POST['id'])){
echo $_POST['id'];
}
?>
and
<Script type="text/javascript">
$(document).on('click', '.edit', function(){
var id = $(this).attr("id");
$.ajax({
type:"post",
url:"edit.php",
data:{id:id},
success:function(data){
$('.tampil').html(data);
}
});
});
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.