Download
//dbconfig.php
<?
$conn = mysql_connect("localhost","root","ednalan");
mysql_select_db("dbname",$conn);
?>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function() {
$(".delete_button").click(function() {
var id = $(this).attr("id");
var dataString = 'id='+ id ;
var parent = $(this).parent();
$.ajax({
type: "POST",
url: "deleteajax.php",
data: dataString,
cache: false,
beforeSend: function()
{
parent.animate({'backgroundColor':'#fb6c6c'},300).animate({ opacity: 0.35 }, "slow");;
},
success: function()
{
parent.slideUp('slow', function() {$(this).remove();});
}
});
return false;
});
});
</script>
<style type="text/css">
body
{
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
}
.comment_box
{
background-color:#D3E7F5; border-bottom:#ffffff solid 1px; padding-top:3px
}
a
{
text-decoration:none;
color:#d02b55;
}
a:hover
{
text-decoration:underline;
color:#d02b55;
}
*{margin:0;padding:0;}
ol.update
{list-style:none;font-size:1.2em; }
ol.update li{ height:50px; border-bottom:#dedede dashed 1px; background-color:#ffffff}
#main
{
width:300px; margin-top:20px; margin-left:100px;
font-family:"Trebuchet MS";
}
.delete_button
{
margin-left:10px;
font-weight:bold;
float:right;
}
h1
{
margin-top:20px;
margin-bottom:20px;
background-color:#dedede;
color:#000000;
font-size:18px;
}
</style>
<div id="main">
<div style="font-size:18px; font-weight:bold">Delete Records with jQuery Effect<br />( FadeOut and SlideUp )</div>
<div style="height:30px"></div>
<ol class="update">
<?php
include("dbconfig.php");
$sql="select * from updates order by msg_id desc";
$result = mysql_query($sql);
while($row=mysql_fetch_array($result))
{
$message=stripslashes($row["message"]);
$msg_id=$row["msg_id"];
?>
<li><?php echo $message; ?> <a href="#" id="<?php echo $msg_id; ?>" class="delete_button">X</a></li>
<?php
}
?>
</ol>
</div>
//deleteajax.php
<?php
if($_POST['id'])
{
$id=$_POST['id'];
$id = mysql_escape_String($id);
$sql = "delete from updates where ms_id='$id'";
mysql_query( $sql);
}
?>
