How to call a bootstrap modal in php when login failed?

Question

I want to show a modal when username is wrong, I have the php code, not full but there is the error :

         header("location:admin.php");
         exit(); 
    } else

  header("location:admin_login.php?error=1");

};
if (isset($_GET['error'])==1){echo "<script type=\"text/javascript\">$('#myModal').modal('show');</script>";
exit();}
?>

And the javascript doesn't work.

Modal code:

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

I have included but still not working, do you have any idea why?

Answer 1

Make sure the script DOM ready and remove exit(); from PHP, even if the script will be DOM ready, exit(); will not let the modal show and even after these changes if the modal still not show, make sure check the jQuery library, you may be running modal show script somewhere in middle of page but jQuery library may be in footer so check your console log for error. Remember jQuery library always comes first.

<?php if (isset($_GET['error'])==1){ ?>
    <script type="text/javascript">
    $(document).ready(function(){
        $("#myModal").modal("show");
    });
    </script>
<?php } ?>

See in Action