Отключить location.reload () при нажатии кнопки, чтобы открыть модальный - PullRequest
Новая
       20

Отключить location.reload () при нажатии кнопки, чтобы открыть модальный

0 голосов
/ 23 апреля 2020

У меня есть страница, которая перезагружается для обновления информации в базе данных. На странице будет показан список файлов с некоторой информацией о каждом файле. Чтобы показать более подробную информацию о файле, пользователь может нажать кнопку для этого файла и открыть модал с дополнительной информацией.

Моя проблема в том, что функция перезагрузки запускает и закрывает модал. Интервал обновления должен составлять 10 секунд, но когда модальный режим открыт, я бы либо отключил перезагрузку, либо вместо этого изменил бы значение времени на несколько минут. И после того, как модальное закрыто, таймер должен go вернуться к 10 секундам. 

           <script type="text/javascript">
         setTimeout(function(){
                location.reload();
                },5000)
        </script>

        <script type="text/javascript">
        $(document).ready(function(){
        $('.orderinfo').click(function(){
        var orderId = $(this).data('id');
        // AJAX request
        $.ajax({
        url: 'ajaxfile.php',
        type: 'post',
        data: {orderNo: orderId},
            success: function(response){ 
                // Add response in Modal body
                $('.modal-body').html(response);
                // Display Modal
                $('#empModal').modal('show'); 
                }
                });
            });
        });
        </script>

И в части HTML это открывает модальное. 

echo "<td style='width:15%'><button data-id='".$orderNo."' class='orderinfo'>Read report</button></td>";

Я пытался разные вещи, но не могу найти способ это исправить. Цени любую помощь

Спасибо

Ответы [ 2 ]

0 голосов
/ 24 апреля 2020

Спасибо, Ахмед Санни.

Я почти все заработал. Он открывает модал и останавливает таймер. Пока все хорошо.

Но у меня не получается запустить таймер при закрытии модального режима. Вот как теперь выглядит код: 

<script>
        var t = 0;
        function timer_pause(){
            clearTimeout(t);
            console.log('pause');
        }

        function timer_start(){
            t = setTimeout(function(){
            location.reload();
            },5000);
        }

        $(document).ready(function(){
            timer_start();
            $('.orderinfo').click(function(){
                timer_pause();
                var orderId = $(this).data('id');
                // AJAX request
                $.ajax({
                url: 'ajaxfile.php',
                type: 'post',
                data: {orderNo: orderId},
                    success: function(response){ 
                        // Add response in Modal body
                        $('.modal-body').html(response);
                        // Display Modal
                        $('#empModal').modal('show'); 
                    }
                });

            // use #modalid or whatever modal selector you have 
            // or if you have close function put resume in it
            $('.orderInfo').on('hidden.bs.modal', function () {
                timer_start();
                })
            });                   
        })
        </script>

В HTML для кнопки закрытия у меня есть это: 

<div class="modal-footer">
<button type="button" class="button" data-dismiss="modal">Close</button>
</div>

Я думаю, у меня нет соединения прямо здесь ,

Вы должны извинить меня, я ничего такого не делал раньше. Просто PHP, HTML и CSS

Спасибо

0 голосов
/ 23 апреля 2020

Вы можете использовать clearTimeout () для остановки. 

     var t = 0;

    function timer_pause(){
        clearTimeout(t);
        console.log('pause');
    }

    function timer_start(){
        t = setTimeout(function(){
                    location.reload();
                    },5000);
    }


    $(document).ready(function(){
        timer_start();
        $('.orderinfo').click(function(){
            timer_pause();
       });
    // use #modalid or whatever modal selector you have 
    // or if you have close function put resume in it
      $('.myModal').on('hidden.bs.modal', function () {
         timer_start();
      })

   })

таким образом, когда вы открываете модальное, он приостанавливает таймер, а когда модальное закрывается, сбрасывает его, вы можете выполнить настройку, чтобы продолжить таймер. с предыдущим временем,

Я не рекомендую вам перезагружать страницу слишком часто, вы можете просто перезагрузить содержимое, если вы показываете таблицу, используете таблицы данных или просто ajax.

...