delete record in a table using jquery ajax
I am learning j query Ajax events.I have inserted and displayed records in php using j query Ajax but I am not able to delete record I have written code but its not working and I don't want table to load again.Please help
TableName : login
Column: id,username,message
comment.php
<script type="text/javascript">
$(document).ready(function(e) {
function showComment(){
$.ajax({
type:"post",
url:"process2.php",
data:"action=showcomment",
success:function(data){
$("#flash").html(data);
}
});
}
showComment();
//Insert records
$("#Submit").click(function(){
if($(":text").val().length==0)
{
// $(this).next().html("Field needs filling");
$(":text").after('<span class="errorkeyup">Field cannot be empty</span>');
//return false;
success = false;
}
else
{
var name=$("#name").val();
var message=$("#message").val();
$.ajax({
type:"post",
url:"process2.php",
data:"name="+name+"&message="+message+"&action=addcomment",
success:function(data){
showComment();
}
});
}
});
$('.delete').click(function(e){
e.stopPropagation();
var deleteID = $(this).attr('name');
var row = deleteID;
$.ajax({
type: "POST",
url: "delete.php?deleteID=" + deleteID,
data: "deleteID="+ deleteID,
success: function(result){
$('#row'+row).fadeOut('fast');
}
});
});
});
</script>
</head>
<body>
<form method="post" name="form" action="">
<div id="content">
Name : <input type="text" name="name" id="name"/>
</br>
Message : <input type="text" name="message" id="message" />
</br>
</div>
<input type="button" value="Submit" id="Submit">
</form>
</div>
<div id="flash"></div>
</form>
</body>
process.php
<?php
mysql_connect("localhost","root","dot1235");
mysql_select_db("chitra");
$action=$_POST["action"];
if($action=="showcomment"){
$show=mysql_query("Select * from login order by id ASC");
echo "<table border=1 id=t1>";
echo "<tr>";
echo "<td>SrNo.</td>";
echo "<td>Name</td>";
echo "<td>Message</td>";
echo "<td>Delete</td>";
echo "</tr>";
$i=1;
while($row=mysql_fetch_array($show)){
//echo "<li><b>$row[name]</b> : $row[message]</li>";
echo "<tr>";
echo"<td>".$i."</td>";
echo "<td>" .$row['username'] ."</td>";
echo "<td>" .$row['message'] ."</td>";
echo "<td><a href='javascript:void(0)'><img src=delete.png class=delete name=".$row[id]."</a></td>" ;
echo "</tr>";
$i++;
}
echo"</table>";
}
else if($action=="addcomment"){
$name=$_POST["name"];
$message=$_POST["message"];
$query=mysql_query("insert into login(username,message) values('$name','$message') ");
if($query){
echo "Your comment has been sent";
}
else{
echo "Error in sending your comment";
}
}
?>
delete.php
<?php
include("connection.php");
if(isset($_POST['id']))
{
$id = $_POST['id'];
$id = mysql_escape_String($id);
$delquery=mysql_query("delete from login where id=$id") or die(mysql_error());
//echo "Record deleted";
}
?>
Answer
in your delete.php page there is little bug.
$(".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();});
}
}
you pass id in url and get mid
so change your delet.php accpording to this.
<?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";
}
?>