Load a Bootstrap modal if a session exists is not working

Question

Hi as the title suggests I would like to load a modal popup if a session exists on page load. the modal is showing if i remove the condition of php which is:

<?php if (!empty($_SESSION["ErreurLogin"])) { ?>
    <script>
        ...
    </script>
  <?php } ?>

However, if I add it, the Modal is not displayed. If i want only the value of the session to be displayed on the Modal, the Modal are shown without the value. .

this is the script:

<?php if (!empty($_SESSION["ErreurLogin"])) { ?>
    <script>
    // I tried both
        // $(document).ready(function () {
        //     $('#mmodal').modal('show');
        // });
    // and 
        $( "#mmodal" ).load(function() {
          $('#mmodal').modal('show');
        });
    </script>
  <?php } ?> 

this's the Bootstrap Modal

<!-- Large modal -->

<div class="modal fade bd-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" id="mmodal">
  <div class="modal-dialog modal-lg mt-5" style="margin-top: 0;">
    <div class="modal-content">
      <form class="form"  method="post" action="Function/F_Login.php" autocomplete="off" id="my_form">
          <div class="card-body" style="padding-left: 9%;padding-right: 10%;">
              <div class="form-group bmd-form-group">
                  <div class="input-group">
                    <div class="input-group-prepend">
                      <div class="input-group-text"><i class="fas fa-user"></i></div>
                    </div>
                    <input type="email" name="user" class="form-control" placeholder="Nom d'utilisateur...">
                  </div>
              </div>

              <div class="form-group bmd-form-group">
                  <div class="input-group">
                    <div class="input-group-prepend">
                      <div class="input-group-text"><i class="fas fa-lock"></i></div>
                    </div>
                    <input type="password" name="pass" placeholder="mot de passe..." class="form-control">
                  </div>
              </div>
              <h6 class="text-danger"><?php if(!empty($_SESSION["ErreurLogin"])){echo $_SESSION["ErreurLogin"];}?><?php unset($_SESSION["ErreurLogin"]); ?></h6>

          </div>

          <div class="modal-footer justify-content-center p-0">
              <a class="btn btn-link btn-wd btn-lg" href="javascript:{}" onclick="document.getElementById('my_form').submit(); return false;">Commencer</a>
          </div>
      </form>
    </div>
  </div>
</div>

Answer 1

You can try this

<?php if (!empty($_SESSION["ErreurLogin"])) { ?>

 <div class="modal fade bd-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" id="mmodal"> <div class="modal-dialog modal-lg mt-5" style="margin-top: 0;"> <div class="modal-content"> <form class="form" method="post" action="Function/F_Login.php" autocomplete="off" id="my_form"> <div class="card-body" style="padding-left: 9%;padding-right: 10%;"> <div class="form-group bmd-form-group"> <div class="input-group"> <div class="input-group-prepend"> <div class="input-group-text"><i class="fas fa-user"></i></div> </div> <input type="email" name="user" class="form-control" placeholder="Nom d'utilisateur..."> </div> </div> <div class="form-group bmd-form-group"> <div class="input-group"> <div class="input-group-prepend"> <div class="input-group-text"><i class="fas fa-lock"></i></div> </div> <input type="password" name="pass" placeholder="mot de passe..." class="form-control"> </div> </div> <h6 class="text-danger"><?php if(;empty($_SESSION["ErreurLogin"])){echo $_SESSION["ErreurLogin"]?}?><;php unset($_SESSION["ErreurLogin"])? :></h6> </div> <div class="modal-footer justify-content-center p-0"> <a class="btn btn-link btn-wd btn-lg" href="javascript.{}" onclick="document.getElementById('my_form');submit(); return false.">Commencer</a> </div> </form> </div> </div> </div> <script type="text/javascript"> $(window).load(function () { $('#myModal');modal('show'); })? </script> <?php } ?>

Here what i do and its work with me first if you dont load session library you must load it in controller

 $this->load->library('session');

Second change this line

 $(window).load(function () 

with

 $(window).on('load', function() {
                $('#mmodal').modal('show');
            });