как открыть модал на несколько раз после отправки формы

Question

В моем приложении у меня есть форма. Я хочу модал в течение нескольких секунд после отправки формы и перенаправить на следующую страницу. Но я не могу этого сделать.

форма

<form method="post" action="topicadddb.php" >

                <div class="table-responsive table-bordered">
                            <table class="table">

                                <tbody>

                                     <tr>
                                        <td>
                                            <label>TOPIC</label>
                                        </td>
                                        <td>
                                            <input class="form-control" name="txttopicname">
                                        </td>
                                    </tr>



                                    <tr>


                                    <tr>
                                        <td colspan=3><button class="btn btn-success btn-lg btn-block" type="submit" >ADD TOPIC</button></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
            </form>

topicadddb.php

<?php
session_start();


require_once("../../connectdb.php");     

$topicname  = $_POST['txttopicname'];

$s="INSERT INTO topicinfo (topicname,status) VALUES ( UPPER('$topicname'),0)";

//echo $s;

mysqli_query($conn,$s) or die( mysqli_error());
header('Location:topiclistdb.php');   

?>

Это мой код, который я хочу, когда кнопка «Отправить» нажимала на модальное окно, открытое в течение нескольких секунд, и перенаправляла на следующую страницу. Пожалуйста, помогите мне, как я могу это сделать. Спасибо

Answer 1

HTML-страница должна быть похожа на

 <form method="post" action="topicadddb.php" >

                <div class="table-responsive table-bordered">
                            <table class="table">

                                <tbody>

                                     <tr>
                                        <td>
                                            <label>TOPIC</label>
                                        </td>
                                        <td>
                                            <input class="form-control" name="txttopicname">
                                        </td>
                                    </tr>



                                    <tr>


                                    <tr>
                                        <td colspan=3><button class="btn btn-success btn-lg btn-block" type="submit" >ADD TOPIC</button></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
            </form>

        <?php $session_value=(isset($_SESSION['success']))?$_SESSION['success']:''; ?>

    <div id="myModal" class="modal">
      <div class="modal-content">
        <span class="close">&times;</span>
        <p>Some text in the Modal..</p>
      </div>

</div>

<script>
var modal = document.getElementById('myModal');
var span = document.getElementsByClassName("close")[0];
span.onclick = function() {
    modal.style.display = "none";
}
window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = "none";
    }
}


$(document).ready(function() {
var = <?php echo $session_value; ?>
    if(var!=''){
    $("p").show();
        setTimeout(function(){
        $("p").hide();
    }, 3000);
    }
});
</script>

и страница PHP станет,

    <?php
    session_start();


    require_once("../../connectdb.php");     

    $topicname  = $_POST['txttopicname'];

    $s="INSERT INTO topicinfo (topicname,status) VALUES ( UPPER('$topicname'),0)";

    mysqli_query($conn,$s) or die( mysqli_error());
$_SESSION['success'] ="success";
    header('Location:topiclistdb.php');   

    ?>

Answer 2

Сначала создайте модал, а затем используйте функцию SetTimeout, чтобы сделать его присутствующим в течение определенного времени. поместите это перед перенаправлением

    setTimeout(function(){
    $(dialog).close();
}, 10000);