我试图创建一个HTML表,列出了数据库表中的所有行。然后,我希望在每一行旁边都有一个按钮,以便用户可以删除该条目。我已经创建了表格,但是我不能让按钮工作。
我一直在寻找周围,我发现这篇文章如何调用一个PHP函数点击一个按钮,但我不能让它工作。我以前从未使用过ajax,所以我可能无法正确理解代码。
代码如下:
遍历表中的所有数据,并为每个条目创建一个按钮
<?php
for ($x = 0; $x < sizeof($data); $x++) {
?>
<input type="submit" class="tableButton" name="<?php echo $x ?>" value="<?php echo $x ?>">
<?php
}
?>
当一个tableButton被点击时,发送它的值给ajax.php
$('.tableButton').click(function () {
var clickBtnValue = $(this).val();
var ajaxurl = 'ajax.php',
data = { 'action': clickBtnValue };
$.post(ajaxurl, data, function (response) {
});
});
ajax.php
获取被按下的按钮的值并对其进行操作
<?php
if (isset($_POST['action'])) {
$data = $_POST['action'];
echo $data;
}
?>
目前我只是让它回显值来测试它,但它什么也不显示。我想让它做的是运行这个查询:
DELETE from myTable WHERE id = $data;
或者如果有人知道更好的方法,请告诉我。
编辑
在做了更多的搜索之后,我发现了为什么这不是我预期的工作。因为我以前从未使用过AJAX,所以我怀疑我遗漏了一些东西,我不知道回声不会直接打印到屏幕上。我只是将echo更改为delete查询并测试了它,它有效…代码很好,但我觉得我应该学习AJAX。谢谢大家的回复。
我也知道sql注入是可能的,这只是一个快速的模型,谢谢。
从我们的角度来看,很难帮到你。
你应该做一些调试,比如:
- 检查相关的ajax.php是否被调用(例如,通过检查控制台的"F12")
- 如果是,检查通过ajax POST传递的数据
- 如果没有,可能是参考链接错误
让我听听你有什么。
您可以这样尝试。我想这会对你有帮助。
Html文件
<html>
<head>
<title>Test</title>
</head>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script>
$('.tableButton').live('click', function(){
var id = $(this).val();
$.ajax({
url:'ajax.php'
,data:{id:id}
,type:'post'
,success:function(data){
if(data == 'success'){
$('#' + id).remove();
}
}
});
});
</script>
<?php
for ($x = 0; $x < 5; $x++) {
?>
<input type="submit" class="tableButton" id="<?=$x?>" name="<?php echo $x ?>"value="<?php echo $x ?>">
<?php
}
?>
</body>
</html>
ajax.php
<?php
if(isset($_POST['id'])){
$id = $_POST['id'];
//delete operation here
//if(deleted) echo 'success';
}
?>
好的。首先,您需要创建行id为的按钮。你可以使用mySQL和PHP循环来实现。按以下格式创建:
<input type="submit" name="test" data-id="23" value="Remove" class="delete_row" />
<input type="submit" name="test" data-id="24" value="Remove" class="delete_row" />
<input type="submit" name="test" data-id="25" value="Remove" class="delete_row" />
<input type="submit" name="test" data-id="26" value="Remove" class="delete_row" />
在这里,将每个按钮中的data-id替换为要删除的行id。(将23、24等动态替换为数据库id)
<<p> Java脚本/strong>$(document).ready(function(){
$(".delete_row").click(function(e){
e.preventDefault();
var deleteId = $(this).attr("data-id");//unique id of the raw to be deleted
var request = $.ajax({
url: "ajax.php",
type: "POST",
data: { id : deleteId },
dataType: "json"
});
request.done(function( msg ) {
if( msg.status )
alert("Deleted successfully!");
else
alert("Something gone wrong!!");
});
request.fail(function( jqXHR, textStatus ) {
alert( "Request failed: " + textStatus );
});
});
});
ajax.php
<?php
/* AJAX check */
if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
$delete_id = $_POST["id"];
if( is_numeric( $delete_id ) ){
/*DELETE QUERT WHERE id = $delete_id (Try to use mysqli or PDO ) */
/* $affected_rows = effected_rows() */
if( $affected > 0 )
{
echo json_encode( array("status" => true ) );die;
}
}
echo json_encode( array("status" => false ) );die;
}
die("Get out of here!");
?>
我希望这对你有帮助:)