Ludatha
04-12-2009, 02:47 PM
I am trying to make a messages system where you can delete messages and it just slides away.
I can get his working in a stand alone php file, but when I try to put it on my site, it doesn't work correctly.
This is the whole code for the working file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a.delete').click(function(e) {
e.preventDefault();
var parent = $(this).parent();
$.ajax({
type: 'get',
url: 'index.php',
data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
beforeSend: function() {
parent.animate({'backgroundColor':'#fb6c6c'},300);
},
success: function() {
parent.slideUp(300,function() {
parent.remove();
});
}
});
});
});
</script>
<body>
<?php
mysql_connect("localhost", "root", "")or die("cannot connect to server");
mysql_select_db("ludatha_test")or die("cannot select db");
if(isset($_GET['delete']))
{
$query = 'DELETE FROM notices WHERE id = '.(int)$_GET['delete'];
$result = mysql_query($query);
}
$query = 'SELECT * FROM notices ORDER BY Mtitle ASC';
$result = mysql_query($query);
while($row = mysql_fetch_assoc($result))
{
echo '<div class="record" id="record-">
<td width="10"><img src="http://ludatha.com/.smileys/letter.gif" alt="" /></td>
<td><a href="#">Hey!!, From <strong>Ludatha Bot</strong> on the <strong>18th March 12:03</strong></a></td>
<td width="200"><a href="#"><img src="http://ludatha.com/.smileys/reply.gif" alt="" /> Reply</a> | <a href="?delete=4" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> | </div></td></tr>
<div class="record" id="record-'.$row['id'].'">
<td width="10"><img src="'.$row['Mread'].'" alt="" /></td>
<td><a href="#">'.$row['Mtitle'].', From <strong>'.$row['Mfrom'].'</strong> on the <strong>'.$row['MreadTime'].'</strong></a></td>
<td width="200"><a href="#"><img src="http://ludatha.com/.smileys/reply.gif" alt="" /> Reply</a> | <a href="?delete='.$row['id'].'" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> |</div>';
}
?>
</body>
</html>
I added the correct files to the header and included the code, but it only removes one cell, no the whole table row.
<script src="http://localhost/system/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a.delete').click(function(e) {
e.preventDefault();
var parent = $(this).parent();
$.ajax({
type: 'get',
url: 'http://localhost/system/pages/messages.php',
data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
beforeSend: function() {
parent.animate({'backgroundColor':'#fb6c6c'},300);
},
success: function() {
parent.slideUp(300,function() {
parent.remove();
});
}
});
});
});
</script>
I wont show the php code here because this forum is not for php, but here is what is outputted to the browser:
<tr class="closed-PM"><div class="record" id="record-4">
<td width="10"><img src="http://ludatha.com/.smileys/letter.gif" alt="" /></td>
<td><a href="#">Hey!!, From <strong>Ludatha Bot</strong> on the <strong>18th March 12:03</strong></a></td>
<td width="200"><a href="#"><img src="http://ludatha.com/.smileys/reply.gif" alt="" /> Reply</a> | <a href="/delete/4/" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> | </div></td></tr>
Can anyone tell me what to do to delete the whole row. (only the cell with <a href="/delete/4/" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> is deleted)
I can get his working in a stand alone php file, but when I try to put it on my site, it doesn't work correctly.
This is the whole code for the working file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a.delete').click(function(e) {
e.preventDefault();
var parent = $(this).parent();
$.ajax({
type: 'get',
url: 'index.php',
data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
beforeSend: function() {
parent.animate({'backgroundColor':'#fb6c6c'},300);
},
success: function() {
parent.slideUp(300,function() {
parent.remove();
});
}
});
});
});
</script>
<body>
<?php
mysql_connect("localhost", "root", "")or die("cannot connect to server");
mysql_select_db("ludatha_test")or die("cannot select db");
if(isset($_GET['delete']))
{
$query = 'DELETE FROM notices WHERE id = '.(int)$_GET['delete'];
$result = mysql_query($query);
}
$query = 'SELECT * FROM notices ORDER BY Mtitle ASC';
$result = mysql_query($query);
while($row = mysql_fetch_assoc($result))
{
echo '<div class="record" id="record-">
<td width="10"><img src="http://ludatha.com/.smileys/letter.gif" alt="" /></td>
<td><a href="#">Hey!!, From <strong>Ludatha Bot</strong> on the <strong>18th March 12:03</strong></a></td>
<td width="200"><a href="#"><img src="http://ludatha.com/.smileys/reply.gif" alt="" /> Reply</a> | <a href="?delete=4" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> | </div></td></tr>
<div class="record" id="record-'.$row['id'].'">
<td width="10"><img src="'.$row['Mread'].'" alt="" /></td>
<td><a href="#">'.$row['Mtitle'].', From <strong>'.$row['Mfrom'].'</strong> on the <strong>'.$row['MreadTime'].'</strong></a></td>
<td width="200"><a href="#"><img src="http://ludatha.com/.smileys/reply.gif" alt="" /> Reply</a> | <a href="?delete='.$row['id'].'" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> |</div>';
}
?>
</body>
</html>
I added the correct files to the header and included the code, but it only removes one cell, no the whole table row.
<script src="http://localhost/system/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a.delete').click(function(e) {
e.preventDefault();
var parent = $(this).parent();
$.ajax({
type: 'get',
url: 'http://localhost/system/pages/messages.php',
data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
beforeSend: function() {
parent.animate({'backgroundColor':'#fb6c6c'},300);
},
success: function() {
parent.slideUp(300,function() {
parent.remove();
});
}
});
});
});
</script>
I wont show the php code here because this forum is not for php, but here is what is outputted to the browser:
<tr class="closed-PM"><div class="record" id="record-4">
<td width="10"><img src="http://ludatha.com/.smileys/letter.gif" alt="" /></td>
<td><a href="#">Hey!!, From <strong>Ludatha Bot</strong> on the <strong>18th March 12:03</strong></a></td>
<td width="200"><a href="#"><img src="http://ludatha.com/.smileys/reply.gif" alt="" /> Reply</a> | <a href="/delete/4/" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> | </div></td></tr>
Can anyone tell me what to do to delete the whole row. (only the cell with <a href="/delete/4/" class="delete"><img src="http://ludatha.com/.smileys/action_delete.gif" alt="" /> Delete</a> is deleted)