Home > Mobile >  Is there away to show automatically Modal and Update data using setInterval Ajax? CodeIgniter PHP
Is there away to show automatically Modal and Update data using setInterval Ajax? CodeIgniter PHP

Time:08-07

I am trying to create an alert for all users when the time expires.

I have created a condition where if the days, hours and minutes become 0 (zero) then the Modal and setInterval shall be triggered.

However, it does not do anything with my current code. The modal on the otherhand does not show automatically, I still need to refresh the page and it does not update as well. Is there a way to achieve this?

View:

<form action="<?php echo base_url(); ?>submissions/lock" id="btnexp" method="post">
  <input type="hidden" value="<?php echo $period['period_id']; ?>" name="period_id">
  <?php if($period['duration']!='0000-00-00 00:00:00'): ?>

          <?php 
              date_default_timezone_set('Asia/Manila');
              $datetime = date("Y-m-d H:i:s");


              $date1 = new DateTime($datetime);
              $date2 = new DateTime($period['duration']);
              $interval = $date1->diff($date2);
              $days = $interval->days;
              $hours = $interval->h;
              $min =  $interval->i;
              // echo $interval->format("%Y-%m-%d %H:%i:%s").'<br>';
              // shows the total amount of days (not divided into years, months and days like above)
              $interval->days; 
              $interval->h;
              $interval->i;
              if($days == 0 && $hours == 0 && $min == 0){ 
          ?>


          <script>
            $(function(){
                    
                    //function
                    setInterval(function(){
                        $.ajax({
                            type: 'POST',
                            url: '<?php echo base_url() ?>submissions/lock',
                            async:false,
                            cache: false,
                            success: function(data){
                              if (data == 0){
                              $('#myModal').modal('show');   
                              }                       
                            },
                            error: function(){
                                alert('Could not get Data from Database');
                            }
                        });
                    }, 1000);                
            });
          </script> 

                  
          <?php  } ?>
  <?php endif; ?>
</form>

Controller: Submissions/Lock

    public function lock()
    {

        $this->submission_model->lock();

    }

CodePudding user response:

You should put your setInterval out side this $(function(){ or you can remove $(function(){ ya

CodePudding user response:

You should using javascript to do this.

setInterval in javascript it is that running every miliseconds you set, but it work only with javascript code, not php.

PHP is server side, JS is client-side.

Maybe it will work for you. Using momentjs to get difference of time.

And set get difference of time run every second with setInterval function

If condition is true, then run ajax and open your modal.

<!-- Moment JS Init -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.min.js" integrity="sha512-Dz4zO7p6MrF VcOD6PUbA08hK1rv0hDv/wGuxSUjImaUYxRyK2gLC6eQWVqyDN9IM1X/kUA8zkykJS/gEVOd3w==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<?php if ($period['duration'] != '0000-00-00 00:00:00') : ?>
    <script>
        $(function() {
            //function
            setInterval(function() {
                var currentDate = moment();
                var duration = moment(`<?= $period['duration'] ?>`);
                var diffDays = currentDate.diff(duration, 'days')
                var diffHours = currentDate.diff(duration, 'hours')
                var diffMinutes = currentDate.diff(duration, 'minutes')

                if (diffDays <= 0 && diffHours <= 0 && diffMinutes <= 0) {
                    $.ajax({
                        type: 'POST',
                        url: `<?= base_url('submissions/lock') ?>`,
                        async: false,
                        cache: false,
                        success: function(data) {
                            $('#myModal').modal('show');
                        },
                        error: function() {
                            alert('Could not get Data from Database');
                        }
                    });
                }
            }, 1000);
        });
    </script>
<?php endif; ?>

<form action="<?= base_url('submissions/lock'); ?>" id="btnexp" method="post">
    <input type="hidden" value="<?php echo $period['period_id']; ?>" name="period_id">
</form>

  • Related