ajax ile güncelleme işlemi yapamıyorum
Mesajlar listem var. Bunları ajax ile aynı sayfada güncelleyip silmek istiyorum. 2 tane sorunum var.
Birincisi: li içindeki elemanları seçip değerlerini alamıyorum. Güncelleme olayını başka sayfaya yönlendirip orada oluşturduğum yeni bir tablo ile yapmak istemiyorum. Direkt o sayfa da listenin içinde olan inputa girilen yeni değerle yapmam gerekiyor. Yani listelenen mesajlarda mesaj textarea şeklinde geliyor. Buradan direkt değiştirip güncelle butonuna bastığım zaman güncellenmesi gerekiyor.
İkincisi: Yine aynı şekilde silme işleminde ajax ile listedeki butona tıklandığında ona özel id'sini alıp silme işlemini gerçekleştiremiyorum.
jquery ile kontrol ettirdiğim zaman bütün elemanların değerini alıyor. Tek tek alamıyorum. Yardımcı olur musunuz ? Biraz aciliyeti var gece 12de teslim etmem gerekiyor.
<?php
$query = $db->query("SELECT * FROM tbl_message", PDO::FETCH_ASSOC);
if ( $query->rowCount() ){
foreach( $query as $row ){
?>
<form action="" method="post" onsubmit="return false;">
<tr>
<td style="width:5%"><?php echo $row['id'] ?></td>
<td style="width:20%"><?php echo $row['u_name'] ?></td>
<td style="width:20%"><?php echo $row['u_surname'] ?></td>
<td style="width:20%"><?php echo $row['u_phone'] ?></td>
<td style="width:5%">
<select name="u_konu" id="konu">
<option value="1" <?php if($row['u_sub'] == 1){echo 'selected';} ?> >Öneri</option>
<option value="2" <?php if($row['u_sub'] == 2){echo 'selected';} ?> >Talep</option>
<option value="3" <?php if($row['u_sub'] == 3){echo 'selected';} ?> >Şikayet</option>
</select>
</td>
<td style="width:20%">
<textarea name="u_mesaj" id="u_mesaj" cols="15" rows="2"><?php echo $row['u_message'] ?></textarea>
</td>
<td style="width:5%">
<input type="submit" class="delete" value="" id="<?php echo $row['id'] ?>">
</td>
<td style="width:5%">
<input type="submit" class="update" value="" id="<?php echo $row['id'] ?>">
</td>
</tr>
</form>
<?php
}
}else {
?>
<?php
$query = $db->query("SELECT * FROM tbl_message", PDO::FETCH_ASSOC);
if (isset($_POST['type'])) {
if ($_POST['type'] == 'delete') {
$delete = $db->prepare("DELETE FROM tbl_message WHERE id = ?");
$delete->execute([$_POST['id']]);
$response = [
'status' => (bool) $delete->rowCount(),
'text' => $delete->rowCount() ? 'Silme işlemi başarılı' : 'Silme işlemi başarısız'
];
} elseif ($_POST['type'] == 'update') {
$update = $db->prepare("UPDATE tbl_message SET u_sub = ?, u_message = ? WHERE id = ?");
$update->execute([
$_POST['konu'],
$_POST['mesaj'],
$_POST['id']
]);
$response = [
'status' => (bool) $update->rowCount(),
'text' => $update->rowCount() ? 'Güncelleme işlem başarılı' : 'Güncelleme işlemi başarısız!'
];
} else {
$response = [
'status' => false,
'text' => 'Hatalı bir işlem gerçekleşti'
];
}
echo json_encode($response);
exit();
}
?>
<!doctype html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<title>Document</title>
<style>
table {
border-collapse: collapse;
}
table, tr, td, th {
border: 1px solid;
}
</style>
</head>
<body>
<table style="width: 100%">
<thead>
<tr>
<th>ID</th>
<th>AD</th>
<th>SOYAD</th>
<th>TELEFON</th>
<th>KONU</th>
<th>MESAJ</th>
<th>SİL</th>
<th>GÜNCELLE</th>
</tr>
</thead>
<tbody>
<?php
if ($query->rowCount()){
foreach( $query as $row ){?>
<tr id="<?= $row['id'] ?>">
<td style="width:5%"><?php echo $row['id'] ?></td>
<td style="width:20%"><?php echo $row['u_name'] ?></td>
<td style="width:20%"><?php echo $row['u_surname'] ?></td>
<td style="width:20%"><?php echo $row['u_phone'] ?></td>
<td style="width:5%">
<select name="u_konu" id="konu">
<option value="1" <?= $row['u_sub'] == 1 ? 'selected' : null ?> >Öneri</option>
<option value="2" <?= $row['u_sub'] == 2 ? 'selected' : null ?> >Talep</option>
<option value="3" <?= $row['u_sub'] == 3 ? 'selected' : null ?> >Şikayet</option>
</select>
</td>
<td style="width:20%">
<textarea name="u_mesaj" id="u_mesaj" cols="15" rows="2"><?php echo $row['u_message'] ?></textarea>
</td>
<td style="width:5%">
<button data-type="delete" class="delete"><i class="fa fa-times"></i></button>
</td>
<td style="width:5%">
<button data-type="update" class="update"><i class="fa fa-redo"></i></button>
</td>
</tr>
<?php
}
} else { ?>
<tr>
<td colspan="8" style="text-align: center">Tabloda veri bulunamadı</td>
</tr>
<?php } ?>
</tbody>
</table>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(function () {
$(".update, .delete").on("click", function () {
let id = $(this).parents("tr").attr("id"),
konu = $(this).parents("tr").find("select").val(),
mesaj = $(this).parents("tr").find("textarea").val(),
type = $(this).data("type")
if (type === 'delete') {
if (!confirm('Silmek istediğine emin misin?'))
return false
}
$.ajax({
method: 'post',
data: {
konu: konu,
mesaj: mesaj,
id: id,
type: type
},
dataType: "json"
}).done(e => {
alert(e.text)
if (type === 'delete' && e.status)
$(this).parents("tr").fadeOut()
})
})
})
</script>
</body>
</html>