按下提交表单时通过Jquery Ajax删除帖子

时间:2013-07-01 10:15:34

标签: php javascript jquery ajax

我有以下表格5-10: -

<div id="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="9" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div id="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="8" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div id="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="7" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div id="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="6" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div id="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="5" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div id="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="4" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>

我在jquery下面执行ajax并删除该特定帖子,但它没有执行删除。

<script type="text/javascript">
$(document).ready(function(){
    $("#post").submit(function() {
            var postid = $('#postid').val();
            var unique= $('#unique').val();
            var str = 'unique='+ unique+ '&postid='+ postid;
            $.ajax({
                type: "POST",
                url: "delete.php",
                data: str,
                success: function(msg) {
                    $("#post").ajaxComplete(function(event, request, settings) {
                        if (msg == 'OK')
                        {
                            result = '<div style="color:red;">Something Went Wrong</div><br />';
                        } else {
                            result = msg;
                        }
                        $("#post").html(result);
                    });
                }
            });

            return false;

        });
});
</script>

我的PHP删除代码: -

<?php
if($_POST['unique'] === $_SESSION['unique']) {
    $delete = $mysqli->query("DELETE from post where postid='".$mysqli->real_escape_string($_POST['postid'])."'");
    echo "DELETED";
} else {
    echo "OK";
}
?>

按下提交功能时没有删除帖子... 我希望每当用户提交任何特定表格时删除该特定的postid ......

1 个答案:

答案 0 :(得分:0)

您需要更改父div以使类名为&#34; post&#34;而不是为所有人提供相同的ID。然后你可以绑定所有具有类&#34; post&#34;提交函数并在函数中找到每个表单作为事件的来源并找到孩子获取值。在此处查看实时解决方案:http://jsfiddle.net/vendettamit/nn9FV/ 更新代码在这里:

$(document).ready(function(){

    $("div.post").submit(function(e){
        console.log(e);
        var currForm = e.delegateTarget.firstElementChild;
            var postid = $(currForm).children('#postid').val();
            var unique= $(currForm).children('#unique').val();
            var str = 'unique='+ unique+ '&postid='+ postid;
        console.log(str)
            $.ajax({
                type: "POST",
                url: "delete.php",
                data: str,
                success: function(msg) {
                    $("#post").ajaxComplete(function(event, request, settings) {
                        if (msg == 'OK')
                        {
                            result = '<div style="color:red;">Something Went Wrong</div><br />';
                        } else {
                            result = msg;
                        }
                        $("#post").html(result);
                    });
                }
            });

            return false;

        });
});

,您的更新HTML将如下所示:

<div class="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="9" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div class="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="8" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div class="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="7" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div class="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="6" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div class="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="5" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>
<div class="post">
<form method="post" action="javascript:alert('success')" >
    <input id="postid" type="hidden" name="post" value="4" />
    <input id="unique" type="hidden" name="unique" value="<?php echo $unique; ?>" />
    <input type="submit" value="Submit" name="submit" />
</form>
</div>