【问题标题】:Form not submitting after bootstrap confirmation引导程序确认后未提交表单
【发布时间】:2019-05-12 14:22:11
【问题描述】:

首先,我很抱歉我对 jquery/javascript 的了解不是很好,所以我的错误对某些人来说可能很明显,但我仍在学习,所以要温柔!

我有一个表单,允许成员删除他们从数据库中发布的帖子。该表单工作正常,使用 php 可以根据需要从数据库中删除数据。我想创建一个弹出窗口,让用户确认他们想要做什么。我不想使用沼泽标准浏览器特定的 onclick 方法,我想要一些更可定制的东西。所以我正在尝试使用 bootbox,我目前在点击时弹出确认框,但是当您选择是时,没有其他任何反应。我怀疑 jquery 的结果没有触发表单,但从我读过的那部分代码来看是好的吗?

我已经在我的 php、jquery 和 html 下面粘贴了

PHP:

<?php
$deletepost = 'none';
$deleteposterror = 'none';

if(isset($_POST['delete'])) {

    $del_topic_id = $_POST['topic_id_value'];

    // sql to delete a record
    $pass_fail = "DELETE FROM topics WHERE topic_id ='$del_topic_id';";

    $pass_fail .= "DELETE FROM posts WHERE topic_id_post ='$del_topic_id'";

    if (mysqli_multi_query($conn, $pass_fail)) {

    $deletepost = 'show';

    }else{

    $deleteposterror = 'show';
    echo "ERROR: Could not able to execute $pass_fail. "  . mysqli_error($conn);    

    }

}
?>

while 循环中的 HTML 和 PHP:

<?php


            $sql1 = "SELECT * FROM topics WHERE topic_by = '".$id."' ORDER BY topic_date DESC ";
            $result1 = mysqli_query($conn, $sql1);

            while($row = $result1->fetch_assoc()) {

            $topic_id = $row ['topic_id'];
            $topic_subject = $row ['topic_subject']; 
            ?>



            <div class='chat_post_titles' >
            <div class='row'>
            <div class='col-md-7 chat_post_text_align_left'>
            <a href="../Chat/post.php?topic_id=<?php echo $topic_id?>"><?php echo $topic_subject?>.</a>
            </div>
            <div class='col-md-2 chat_post_text_align_right'>
            <?php
            $my_date = $row['topic_date'];
            $date = DATE("G:i:s d/m/Y",strtotime($my_date));
            ?>
            <div class='hide_text'>Post Date: </div>
            <?php echo $date?>
            </div>
            <div class='col-md-2 chat_post_text_align_centre'>
            <div class='hide_text'>Delete Post: </div>

            <form method="post" class="delete_post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
            <input type="hidden" name="topic_id_value" id="topic_id_value" value="<?php echo $topic_id?>">
            <button type="submit" name="delete" id="delete" class="btn btn-danger buttonElement">Delete</button>
            </form>
            </div>
            </div>
            </div>
            <?php
            }
            ?>

页面底部的JQUERY:

</body>
<?php include("../PHP/js.php"); ?>
<script type="text/javascript" src="../Members/updatedetails.js"></script>
<script type="text/javascript" src="../Members/bootbox.min.js"></script>
<script>

$('form').on('click','button.buttonElement',function (e) {
    var form = $(this).closest('form'); // <-- add this

    e.preventDefault();

    bootbox.confirm({
        message: "Are you sure you want to delete your post?", 
        title: "Delete Post",
        buttons: {
            cancel: { 
                label: "No", 
                className: "btn btn-default"
            },
            confirm: { 
                label: "Yes", 
                className: "btn btn-default"
            }
         },
         callback: function(result) {
             if(result == true) {
                 form.submit();
             }
         }
    });
 });

</script>

</html>

【问题讨论】:

  • 您的回调函数会检查变量“result”,但据我所知,该变量并未设置在任何地方。确保单击“是”设置结果 = true,然后应该执行提交功能。
  • 感谢HappyAnt的建议,但我试过了,还是不行!我同意这一定与此有关,但不确定是什么
  • 在回调函数中使用 console.log(result) 会得到什么?它应该根据 bootbox.js 文档工作。
  • 我建议尝试 Ilker Kadir Ozturk 的评论。您的结果变量没有评估为“true”,或者您的表单选择器有问题。关于第二种可能性,您可以尝试使用表单的 id 作为选择器,而不是依靠 jQuery 在 onclick 函数的第一行中找到最接近的表单。尝试用 $("#delete").submit() 替换脚本中的最后一行,然后看看会发生什么。
  • 所以我尝试了你所说的 Ozturk 并且它输出为真,所以它按预期输出,但是我不确定为什么在 if 语句中它不提交然后表单作为结果等于真?再次感谢您的帮助。我也试过你的想法 HappyAnt 但没有运气。我知道这会很容易!

标签: php jquery bootstrap-modal confirmation


【解决方案1】:

终于弄清楚了为什么我的代码在我使用的 php 中不起作用 if(isset($_POST['delete'])) 但是当使用 javascript submit() 函数时,这个名称 attr 被删除。所以我像if(isset($_POST['topic_id_value']))一样使用了隐藏输入的名称,它正常工作。

仍然感谢给我建议的人

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-11-12
    • 2022-08-15
    相关资源
    最近更新 更多