Javascript从数据库中删除/删除表行
Javascript deleting from database/fading the table row away
首先我不知道如何指定标题很抱歉。
我有一个相当混乱的代码,但基本上这是它应该做的。当删除按钮被按下时,整个tr应该消失。目前只有最后一个带有按钮的td会逐渐消失。我试着替换
中的a$('a').click(function(){
with tr.但是当我这样做的行会消失,但它不会在数据库中删除。有人知道解决办法吗?提前感谢
ps:对不起我的英语和糟糕的显示代码。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="style.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$('document').ready(function(){
$('a').click(function(){
var del_id = $(this).attr('id');
var parent = $(this).parent();
$.post('delete.php', {id:del_id},function(data){
parent.slideUp('slow', function() {$(this).remove();});
});
});
});
</script>
</head>
<body>
<div id="content1"></div>
<table cellpadding="0" cellspacing="0" border="0" id="table" class="sortable">
<thead>
<tr>
<th class="nosort"><h3>ID</h3></th>
<th><h3>Merk</h3></th>
<th><h3>Type</h3></th>
<th><h3>Imei</h3></th>
<th><h3>Serienummer</h3></th>
<th><h3>Kleur</h3></th>
<th><h3>Locatie</h3></th>
</tr>
</thead>
<tbody>
<?php
include 'Includes/database_connection.php';
$sql = "select *
FROM units";
$result = mysql_query($sql,$con);
while($row = mysql_fetch_assoc($result)){
echo "<tr>";
echo "<td>{$row['id']}</td><td>{$row['merk']}{$row['type']}{$row['imei']}{$row['serienr']}{$row['kleur']}{$row['locatie']}<a href='"javascript:return(0);'" id='"{$row['id']}'"><img src='"images'delete_icon.gif'" height='"12px'" width='"12px'"/></a></td>";
echo "</tr>";
}
while($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td>".$row['id']."</td>";
echo "<td>".$row['merk']."</td>";
echo "<td>".$row['type']."</td>";
echo "<td>".$row['imei']."</td>";
echo "<td>".$row['serienr']."</td>";
echo "<td>".$row['kleur']."</td>";
echo "<td>".$row['locatie']."</td>";
?>
<td><a href="#" onclick="window.open('test1.php?id=<?php echo $row['id']; ?>', 'newwindow', 'width=400, height=600'); return false;"><img src="images/gtk-edit.png"/></a></td>
<?php
echo "</tr>";
}
?>
</tbody>
</table>
<div id="controls">
<div id="perpage">
<select onchange="sorter.size(this.value)">
<option value="5" selected="selected">5</option>
<option value="10" >10</option>
<option value="20">20</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
<span>Weergeven per pagina</span>
</div>
<div id="navigation">
<img src="images/first.gif" width="16" height="16" alt="First Page" onclick="sorter.move(-1,true)" />
<img src="images/previous.gif" width="16" height="16" alt="First Page" onclick="sorter.move(-1)" />
<img src="images/next.gif" width="16" height="16" alt="First Page" onclick="sorter.move(1)" />
<img src="images/last.gif" width="16" height="16" alt="Last Page" onclick="sorter.move(1,true)" />
</div>
<div id="text">Pagina <span id="currentpage"></span> van <span id="pagelimit"></span></div>
</div>
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript">
var sorter = new TINY.table.sorter("sorter");
sorter.head = "head";
sorter.asc = "asc";
sorter.desc = "desc";
sorter.even = "evenrow";
sorter.odd = "oddrow";
sorter.evensel = "evenselected";
sorter.oddsel = "oddselected";
sorter.paginate = true;
sorter.currentid = "currentpage";
sorter.limitid = "pagelimit";
sorter.init("table",1);
</script>
</div>
</body>
和我的进程文件
<?php
include 'Includes/database_connection.php';
$id = $_POST['id'];
$safeid = mysql_real_escape_string($id);
$query = mysql_query("delete from units where id=$id", $con);
?>
当您找到a
的父级时,您正在找到td
。这就解释了为什么你看到的是td
而不是tr
消失。
因此,使用closest("tr")
而不是parent()
来查找行:
//var parent = $(this).parent();
var parent = $(this).closest("tr");
然后slideUp/remove parent
…然后你可能还想把parent
重命名为parentRow
。
表示删除数据库中的数据。看来你的代码正在试图找到a
的id
属性,所以你要确保在a
中有一个id
属性,与你想要从数据库中删除的id相匹配……比如<a href="#" id="<?php echo $row['id']; ?>" ... />
另一个解决方案,如果您希望能够单击行中的任何位置(因为您提到了尝试),您可以这样做:
$('document').ready(function () {
$('tr').click(function () {
//this assumes id will always be within the first td
//you could also put classes on your td's to identify
var del_id = $(this).find("td").first().text();
var row = $(this);
$.post('delete.php', {
id: del_id
}, function (data) {
row.slideUp('slow', function () {
row.remove();
});
});
});
});
相关文章:
- 解析云代码作业:删除在数据库中已经存在一个小时的行
- 删除数据库(JSP)上的一行
- 使用Ajax和JQuery从SQL数据库中添加和删除一行
- 如何让ajax与数据库交互,以便发布、获取和删除
- 从mysql数据库中删除项目,然后返回最后一页
- 在删除数据库值之前具有确认屏幕
- 在确认屏幕后删除数据库值 - 值不删除
- 索引数据库删除数据库不会重置版本
- 如果出现成功 = 2 消息,如何删除数据库行
- 单击取消按钮后如何删除数据库行
- 当我单击“取消”按钮时,它不会删除数据库行
- 如何从下面的代码中删除数据库中的图像
- 如何在15天后自动删除数据库中的一行数据
- 使用javascript和php删除数据库行
- MongoDB / mongab Remove请求在本地工作,但在现场时删除数据库
- 如何删除数据库使用数组方法DELETE
- 删除数据库条目和AngularJS.如果一个条目不能被删除,我应该抛出异常吗?
- 如何在WebSQL中以编程方式删除数据库
- JavaScript打印和AJAX保存/删除数据库
- 在Mocha中,Mongoose不能正确地删除数据库并关闭连接