使用 jQuery Ajax 刪除 mySQL 表行
2023-09-24
php問題
html5模板網
Deleting mySQL Table Row with jQuery Ajax(使用 jQuery Ajax 刪除 mySQL 表行)
本文介紹了使用 jQuery Ajax 刪除 mySQL 表行的處理方法,對大家解決問題具有一定的參考價值,需要的朋友們下面隨著小編來一起學習吧!
問題描述
我正在嘗試這樣做,因此當我單擊跨度圖標時,它會將 article_id 發送到我的 php sql 頁面,該頁面將刪除我的文章,我正在使用 jQuery Ajax 發送 id,該 id 在 jQuery 上發送沒問題一邊但是在 http post 請求完成后,我的表格行仍然存在,誰能看看我的代碼是否有問題,在此先感謝!
$row){?><div class="row" id="page_<?php echo $row['art_id']; ?>"><div class="第一列"><span class="icon-small move"></span><a href="edit-article.php?art_id=<?php echo $row['art_id']; ?>"><span class="icon-small edit"></span></a><span id="<?php echo $row['art_id']; ?>"class="icon-small垃圾"></span>
<div class="第二列"><p><?php echo $row['art_title'];?></p></div><div class="第二列"><p><?php echo $row['art_company'];?></p></div><div class="第二列"><p><?php echo $row['cat_name'];?></p></div><div class="第一列"><p><?php echo $row['art_date'];?></p></div><div class="第一列"><p><?php echo $row['art_rating'];?></p></div><div class="第一列"><p><?php echo $row['art_price'];?></p></div><div class="第一列"><p><?php echo $row['sta_name'];?></p></div><div class="第一列"><a href=""><span class="icon-small star"></span></a></div>
<?php}}別的 {回聲失敗";}?>jQuery$(document).ready(function(){$(".trash").click(function(){var del_id = $(this).attr('id');$.ajax({類型:'POST',url:'ajax-delete.php',數據:'delete_id='+del_id,成功:功能(數據){如果(數據){}別的 {}}});});});PHP mySQL 語句if(isset($_POST['delete_id'])) {$sql_articles = "DELETE FROM app_articles WHERE art_id = ".$_POST['delete_id'];如果(查詢($sql_articles)){回聲是";}別的 {回聲否";}}別的 {回聲失敗";}?>
解決方案
你的行仍然存在的原因是因為 AJAX 調用沒有刷新頁面.如果您想刪除您的行,您必須執行以下操作:
假設您的跨度點擊事件在行內
$(".trash").click(function(){var del_id = $(this).attr('id');var rowElement = $(this).parent().parent();//抓取行$.ajax({類型:'POST',url:'ajax-delete.php',數據:{delete_id:del_id},成功:功能(數據){如果(數據==是"){rowElement.fadeOut(500).remove();}別的 {}}});
替換:
數據:'delete_id='+del_id,
與:
數據:delete_id:del_id,
I'm trying to make it so when I click a span icon it will send the article_id to my php sql page which deletes my article, I'm using jQuery Ajax to send the id, the id sends alright on the jQuery side but after the http post request is done my table row is still there, can anyone see if somethings wrong with my code, thanks in advance!
<?php
$sql_categories = "SELECT art_id, art_title, art_company, art_cat_id, art_sta_id, art_date, art_rating, art_price, cat_id, cat_name, sta_id, sta_name
FROM app_articles LEFT JOIN app_categories
ON app_articles.art_cat_id = app_categories.cat_id
LEFT JOIN app_status
ON app_articles.art_sta_id = app_status.sta_id
ORDER BY art_order ASC";
if($result = query($sql_categories)){
$list = array();
while($data = mysqli_fetch_assoc($result)){
array_push($list, $data);
}
foreach($list as $i => $row){
?>
<div class="row" id="page_<?php echo $row['art_id']; ?>">
<div class="column one">
<span class="icon-small move"></span>
<a href="edit-article.php?art_id=<?php echo $row['art_id']; ?>"><span class="icon-small edit"></span></a>
<span id="<?php echo $row['art_id']; ?>" class="icon-small trash"></span>
</div>
<div class="column two"><p><?php echo $row['art_title']; ?></p></div>
<div class="column two"><p><?php echo $row['art_company']; ?></p></div>
<div class="column two"><p><?php echo $row['cat_name']; ?></p></div>
<div class="column one"><p><?php echo $row['art_date']; ?></p></div>
<div class="column one"><p><?php echo $row['art_rating']; ?></p></div>
<div class="column one"><p><?php echo $row['art_price']; ?></p></div>
<div class="column one"><p><?php echo $row['sta_name']; ?></p></div>
<div class="column one"><a href=""><span class="icon-small star"></span></a></div>
</div>
<?php
}
}
else {
echo "FAIL";
}
?>
jQuery
$(document).ready(function(){
$(".trash").click(function(){
var del_id = $(this).attr('id');
$.ajax({
type:'POST',
url:'ajax-delete.php',
data: 'delete_id='+del_id,
success:function(data) {
if(data) {
}
else {
}
}
});
});
});
PHP mySQL Statement
if(isset($_POST['delete_id'])) {
$sql_articles = "DELETE FROM app_articles WHERE art_id = ".$_POST['delete_id'];
if(query($sql_articles)) {
echo "YES";
}
else {
echo "NO";
}
}
else {
echo "FAIL";
}
?>
解決方案
the reason your row is still there because AJAX call does not refresh the page. If you want your row to be removed you gotta do something like:
ASSUMING that your span click event is inside the row
$(".trash").click(function(){
var del_id = $(this).attr('id');
var rowElement = $(this).parent().parent(); //grab the row
$.ajax({
type:'POST',
url:'ajax-delete.php',
data: {delete_id : del_id},
success:function(data) {
if(data == "YES") {
rowElement.fadeOut(500).remove();
}
else {
}
}
});
Replace:
data: 'delete_id='+del_id,
with:
data: delete_id : del_id,
這篇關于使用 jQuery Ajax 刪除 mySQL 表行的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!
【網站聲明】本站部分內容來源于互聯網,旨在幫助大家更快的解決問題,如果有圖片或者內容侵犯了您的權益,請聯系我們刪除處理,感謝您的支持!