Rails4 - perché hidden.bs.modal non sta sparando?

Question

Ho bootstrap 3.3.1 nel mio gemfile. Installa il pacchetto.

Ho il seguente, a mio avviso

<div class="row text-center"> 

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
     <script src="https://apis.google.com/js/platform.js" async defer></script> 

     <button type="button" class="btn mybtn-primary" data-toggle="modal" data-target="#myModal"> 
      Start Practice Group 
     </button> 

     <!-- Modal --> 
     <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
      <div class="modal-dialog modal-sm"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> 
       <h4 class="modal-title" id="myModalLabel">Select Language</h4> 
       </div> 

       <div class="modal-body"> 



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



       <button type="button" class="btn" id="submit_form">Submit</button> 

       <!--<div class='modal-body1'>--> 
       <!-- <h3>Close and open, I will be gone!</h3>--> 
       <!--</div>--> 

       </div> 

       <div class="modal-body2"> 
       <div id="placeholder-div1"> 
       </div>      
       </div> 

       <div class="modal-footer"> 

       </div> 


       <script type="text/javascript"> 
       var render_button = function() { 
        var data = $('#lang').val() + " " + $('#level').val(); 
        console.log(data); 
        gapi.hangout.render('placeholder-div1', { 
         'render': 'createhangout', 
         'initial_apps': [{'app_id' : '1097853', 'start_data' : $('#lang').val() + " " + $('#level').val(), 'app_type' : 'ROOM_APP' }] 
        }); 
        } 

       $(function(){ 
        $('#submit_form').click(function(){ 
         console.log("Submitted"); 
         render_button(); 
        }); 

       }); 
       // $(function(){ 
       //  $('#myModal').on('hidden.bs.modal', function (e) { 
       //  console.log("Modal hidden"); 
       //  $("#placeholder-div1").html(" "); 
       //  }); 
       // }); 
       $(document).ready(function() { 
        console.log("Document Loaded"); 
        $('#myModal').on("hidden.bs.modal", function() { 
        console.log("Modal hidden"); 
        $(".modal-body1").html("Where did he go?!?!?!"); 
        }); 
       }); 
       $(document).ready(function() { 

        $('#myModal').on('hidden.bs.modal', function() { 
         alert('hidden event fired!'); 
        }); 

        $('#myModal').on('shown.bs.modal', function() { 
         alert('show event fired!'); 
        }); 
       }); 
       </script> 

      </div> 
      </div> 
     </div> 

    </div> 

Gli spettacoli modali e chiude perfettamente. Ma il seguente non viene attivato.

   $('#myModal').on("hidden.bs.modal", function() { 
        console.log("Modal hidden"); 
        $(".modal-body1").html("Where did he go?!?!?!"); 
        }); 

e anche

alert('hidden event fired!'); 
alert('show event fired!'); 

Answer 1

hai bisogno di impegnare quegli eventi al gestore spettacolo. In altre parole cambiare questo:

$('#myModal').on("hidden.bs.modal", function() { 
        console.log("Modal hidden"); 
        $(".modal-body1").html("Where did he go?!?!?!"); 
        }); 

a

$('#myModal').on("hidden.bs.modal", function() { 
        console.log("Modal hidden"); 
        $(".modal-body1").html("Where did he go?!?!?!"); 
        }).modal('show');