• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Window Modal does not work

#11
(06-10-2019, 06:36 PM)hamanalda Wrote: Is the modal window called?
$('#myModal').on('show.bs.modal', function (event) {
     console.log('myModal show~~~~~~~');
})
$('#myModal').modal();

If the call does not work 
<script>
$(document).ready(function(){
    function on_ready() {
        $('#myModal').on('show.bs.modal', function (event) {
            console.log('myModal show~~~~~~~');
        })
        $('#myModal').modal();
    }
    on_ready();
});
</script>

If called, Test it with the following code
<!-- Modal -->
<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>
https://getbootstrap.com/docs/3.4/javascript/#modals

Good luck~

Hello. Is it for me to test this code first? Without the <script> tag?
How to test this?

Code:
Is the modal window called?
$('#myModal').on('show.bs.modal', function (event) {
    console.log('myModal show~~~~~~~');
})
$('#myModal').modal();


This second part is to be used along with html bootstrap below, ok?
Sorry, but I do not understand: the first code is for me to test how?
The first and second scrip JS are the same, correct?
Reply

#12
Using the inspect code I saw this error."validator.min.js:9 Uncaught ReferenceError: jQuery is not defined at"
Well, from what I understand I have to call jquery.js first of all. But it's embedded in the html_header.html, which is always called to mount the screen.

html_header.html
<!doctype html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../../../favicon.ico">

<title>Sistema Escolar Integrado - SEI.</title>

<!-- Principal CSS do Bootstrap
<link href="<?php echo base_url();?>dist/css/bootstrap.min.css" rel="stylesheet">-->

<!-- Estilos customizados para esse template -->
<link href="<?php echo base_url();?>assets/css/dashboard.css" rel="stylesheet">
<script type="text/javascript" src="<?php echo base_url();?>assets/js/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/popper.min.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/bootstrap-modal.js"></script>


<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
Reply

#13
SORTED OUT
Excuse me. The header.php file path was wrong and so was loading an outdated file.
Reply

#14
Check the console tab
(06-11-2019, 07:25 AM)RRIOS Wrote: ...
Reply

#15
In your web browser hit F12 for the Developer tools then click on console to see
what it is doing.

Plus why are you using Bootstrap 3.3.6 when Bootstrap 3.4.1 has been released?
What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009.  ( Skype: insitfx )
Reply

#16
Instead of this

Code:
$('#myModal').modal();


you should use

Code:
$('#myModal').modal('show');
Reply

#17
Here are some examples on how to do it.

Dynamically load content in Bootstrap Modal with AJAX

Ajax dynamic data load process in codeigniter with Bootstrap modal
What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009.  ( Skype: insitfx )
Reply

#18
(06-17-2019, 08:35 AM)InsiteFX Wrote: Here are some examples on how to do it.

Dynamically load content in Bootstrap Modal with AJAX

Ajax dynamic data load process in codeigniter with Bootstrap modal

Thank You !
Reply

#19
But its not working, getting the same error.

--------------------------------
Regards,
BBBootstrap
(Codeigniter lover)
Reply


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2019 MyBB Group.