удалить запись в таблице с помощью jquery ajax

на вашей странице delete.php есть небольшая ошибка.

  $(".delete_button").click(function() { var id = $(this).attr("mid"); var dataString = 'id='+ id ; var parent = $(this).parent(); $.ajax({ type: "POST", url: "delete.php", data: dataString, cache: false, success: function() { if(id % 2) { parent.fadeOut('slow', function() {$(this).remove();}); } else { parent.slideUp('slow', function() {$(this).remove();}); } } 

вы передаете id в URL- delet.php и получите mid чтобы сменить delet.php delete.php на это.

 <?php include("connection.php"); if(isset($_POST['id'])) //mid to id { $id = $_POST['id']; //mid to id $id = mysql_escape_String($id); $delquery=mysql_query("delete from login where mid=$id") or die(mysql_error()); //echo "Record deleted"; } ?> в <?php include("connection.php"); if(isset($_POST['id'])) //mid to id { $id = $_POST['id']; //mid to id $id = mysql_escape_String($id); $delquery=mysql_query("delete from login where mid=$id") or die(mysql_error()); //echo "Record deleted"; } ?> 

Вот основа всей логики, закодированной с помощью JQuery:

 $(document).ready(function() { $('table#delTable td a.delete').click(function() { if (confirm("Are you sure you want to delete this row?")) { var id = $(this).parent().parent().attr('id'); var data = 'id=' + id ; var parent = $(this).parent().parent(); $.ajax( { type: "POST", url: "delete_row.php", data: data, cache: false, success: function() { parent.fadeOut('slow', function() {$(this).remove();}); } }); } }); // style the table with alternate colors // sets specified color for every odd row $('table#delTable tr:odd').css('background',' #FFFFFF'); }); 

Давайте выясним, что здесь происходит, используя методологию разделения и правила.

 $(document).ready(function() 

Это функция JQuery, которая запускается, как только документ становится готовым. Это похоже на событие onload, но функция JQuery намного быстрее. Поэтому мы хотим иметь возможность запускать этот код, когда страница будет готова.

 $('table#delTable td a.delete').click(function() 

Если вы работали над селекторами CSS, то выше строка не должна быть для вас большой загадкой. Вы можете использовать один и тот же синтаксис для целевых элементов с помощью JQuery. В основном это говорит о том, что таблица с id delTable и TD внутри нее, которая имеет гиперссылку с удалением класса при нажатии, запускает код, указанный в этой функции. Поэтому, когда нажата гиперссылка с классом named delete внутри TD в таблице с id delTable, тогда будет указан указанный код.

 if (confirm("Are you sure you want to delete this row?")) 

Мы хотим подтвердить, действительно ли пользователь хочет удалить строку.

 var id = $(this).parent().parent().attr('id'); var data = 'id=' + id ; var parent = $(this).parent().parent(); 

Имейте в виду, что в JQuery значение $ (this) всегда относится к целевому элементу, который в нашем случае является гиперссылкой с удалением класса. attr используется для получения или установки атрибутов тегов. Таким образом, переменная id ссылается на родителя этой гиперссылки, которая является TD, а затем родителем этого TD, который является TR. Итак, здесь мы получаем атрибут id этого TR. В HTML-коде мы будем назначать поля первичного ключа каждой строки этим TR для идентификации и удаления записей. Переменная данных позволяет отправлять данные как часть запроса ajax, выполненного с использованием JQuery. Родительская переменная относится к каждому TR, содержащему целевой элемент, который является гиперссылкой с удалением класса.

 $.ajax( { type: "POST", url: "delete_row.php", data: data, cache: false, success: function() { parent.fadeOut('slow', function() {$(this).remove();}); } }); 

Функция $ .ajax используется для отправки ajax-запросов. Среди его аргументов тип ссылается на метод запроса, будь то POST или GET, url ссылается на скрипт, который получит данные запроса ajax и возвращает некоторый ответ, данные относятся к данным, которые будут отправляться как часть запроса ajax, аналогичного строке запроса форма, кеш контролирует, будет ли кеш включен или выключен для запроса, потому что в запросах IE кэшируется и функция успеха, которая также является атрибутом функции $ .ajax, запускает код внутри нее, если запрос прошел успешно.

 parent.fadeOut('slow', function() {$(this).remove();}); 

Как объяснялось ранее, родитель ссылается на ТР в нашем случае. Функция fadeOut нуждается в двух аргументах; скорости и функции анимации. Итак, что делает эта строка, так это то, что он удаляет родительский элемент, вытесняя его, а затем целевую ссылку, используя метод remove (). Таким образом, целая строка исчезла и с помощью ajax-запроса также удаляется запись из базы данных. Здесь мы использовали функцию анимации fadeOut JQuery, но есть больше анимаций.

 $('table#delTable tr:odd').css('background',' #FFFFFF'); 

Эта строка означает, что применить стиль фона к каждому нечетному TR таблицы с id delTable. Теперь, поскольку наш код выполняется, когда страница готова, поэтому наша таблица будет иметь альтернативные цвета для каждой нечетной строки.

Вы можете скачать его здесь .

в изменении javascript

 var dataString = 'id='+ id ; 

в

 var dataString = 'mid='+ id ; 

POST values различны. delete.php POST values следующим образом.

 <?php include("connection.php"); if(isset($_POST['id'])) // changed into 'id' { $id = $_POST['mid']; $id = mysql_escape_String($id); $delquery=mysql_query("delete from login where mid=$id") or die(mysql_error()); //echo "Record deleted"; } ?> в <?php include("connection.php"); if(isset($_POST['id'])) // changed into 'id' { $id = $_POST['mid']; $id = mysql_escape_String($id); $delquery=mysql_query("delete from login where mid=$id") or die(mysql_error()); //echo "Record deleted"; } ?> 

Человек, у вас есть следующая строка в вашем javascript-коде, в обработчике удаления:

 var id = $(this).attr("mid"); 

Таким образом, вы получаете несуществующий атрибут «mid» из ссылки «Удалить».

В вашем process.php :

 <td><a href="#" id="<?php echo $mid; ?>" class="delete_button">Delete</a></td> 

Вы явно должны назначить .attr('id') переменной id .

Кроме того, как отмечали другие комментаторы, ваш скрипт delete.php ожидает параметр $_POST['mid'] , но вы отправляете ему id .

Почему странное именование вообще? Просто отбросьте этот «средний» материал и повсюду используйте «id».

И, кстати, если вы назначаете пользовательский обработчик кликов для ссылки HTML, лучше всего вызвать event.preventDefault() как первое, что нужно сделать в обработчике, потому что в противном случае браузер попытается следовать href этой ссылки, в вашем случае – прокрутка страницы вверх.

Я вижу две проблемы здесь

1. Переменная на стороне сервера называется mid которой вы отправляете id

2. parent должен указывать на tr в вашем случае, это указывает на td

   $ (". delete_button"). click (function () {var id = $ (this) .attr ("mid"); var dataString = 'mid =' + id; var parent = $ (this) .closest (' тр ');

    $.ajax({ type : "POST", url : "delete.php", data : dataString, cache : false, success : function() { if (id % 2) { parent.fadeOut('slow', function() { $(this).remove(); }); } else { parent.slideUp('slow', function() { $(this).remove(); }); } } }); return false; 

   });

Я думаю, проблема в имени переменной.

В вашей функции AJAX вы использовали имя переменной 'id' .

 $(".delete_button").click(function() { var id = $(this).attr("mid"); var dataString = 'id='+ id ; // Here var parent = $(this).parent(); 

Но в процессе удаления вы получаете его от $_POST['mid']

 if(isset($_POST['mid'])) // Change this to $_POST['id'] { $id = $_POST['mid']; // Change this to $_POST['id'] 

Используйте $id = $_POST['id'] в файле delete.php вместо $_POST['mid'] , тогда он должен работать.

Я сделал бы это так, намного проще и чище:

delete.php

 <?php include("connection.php"); if(!isset($_REQUEST['action'])) die("Invalid request"); if(!isset($_REQUEST['id'])) die("Invalid Comment ID"); $action = $_REQUEST['action']; if($action == 'remove_comment') { $id = (int)$_REQUEST['id']; $delquery = mysql_query("DELETE FROM `login` WHERE mid=$id") or die(mysql_error()); echo 1; } ?> в <?php include("connection.php"); if(!isset($_REQUEST['action'])) die("Invalid request"); if(!isset($_REQUEST['id'])) die("Invalid Comment ID"); $action = $_REQUEST['action']; if($action == 'remove_comment') { $id = (int)$_REQUEST['id']; $delquery = mysql_query("DELETE FROM `login` WHERE mid=$id") or die(mysql_error()); echo 1; } ?> 

js script:

 function RemoveComment(comment_id) { var row = $("table#comments tr#commentid-"+comment_id); if(row.length < 1) return false; //if element doesnt exist on our page $.post("http://yourhost/delete.php", { action: "remove_comment", id: comment_id }, function(response) { if(response == 1) row.fadeOut(); else alert(response); }); } 

РЕДАКТИРОВАТЬ:

 $(".delete_button").click(function() { var id = $(this).attr("id"); var dataString = 'id='+ id ; var parent = $(this).parent(); 

моя «строка var» является «родителем var» в вашем коде, я просто использовал разные имена элементов и идентификаторы. Вы должны использовать свои.

Вместо приветствий!