jquery - Bootstrap modal event "shown.bs.modal" doesn't fire when declared in iframe -

ik have created , initialized bootstrap modal in parent document, , "shown.bs.modal" event declared in iframe on document ready. parent , iframe documents both on same domain. problem event doesn't fire when modal opened. ideas why doesn't work?

modal html in parent document:

<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-hidden="true">     <div class="modal-dialog">         <div class="modal-content">             <div class="modal-header"><h4>title</h4></div>             <div class="modal-body"></div>             <div class="modal-footer"></div>         </div>     </div> </div> 

jquery in parent document:

$(document).ready(function(){     $('.modaltrigger').on('click.openmodal', function(e){          e.preventdefault();          var trigger = $(this);         var modal = top.$('#modal');          modal.modal('show');     }); }); 

jquery in iframe:

$(document).ready(function(){     var modal = $('#modal', window.top.document); // selects right element in parent window     modal.on('shown.bs.modal', function(e) {         console.log('test'); // doesn't fire     }); }); 

i'm using jquery 1.11.2 , bootstrap 3.

when comes iframes, interacting 2 different pages(maybe 2 different domains). when fire event in iframe, trigger event in iframe alone, not main document. reason why not working might because browser not allow it.

a work around use jquery postmessage allows communicate 2 pages. basically, need when event fired in main document, send postmessage iframe. receive postmessage in iframe , show model in iframe.

you should check example out : http://benalman.com/code/projects/jquery-postmessage/examples/iframe/

edit/update:

another way using getscript instead of using iframe. code go :

$(document).ready(function(){   $('.modaltrigger').on('click.openmodal', function(e){      e.preventdefault();      var trigger = $(this);     var modal = top.$('#modal');     $.getscript("test.js",function(){       modal.modal('show');     });   }); }); 

test.js

var modal = $('#modal', window.top.document); console.log('test');// write event want keep on modal 

going approach, might able acheive functionality desire(based on comments). when click on button triggers modal, call $.getscript, , execute set of commands (can used create addition events). after executed, show model updated events.