Vincent
Vincent

Reputation: 16216

Trigger events in iframe's parent window

Why is the following not working:

//iframe:
window.parent.$(document).trigger('complete');

//parent window:
$(document).bind('complete', function(){
  alert('Complete');
});

while the following IS working:

//iframe:
window.parent.$('body').trigger('complete');

//parent window:
$('body').bind('complete', function(){
  alert('Complete');
});

?

Upvotes: 25

Views: 38381

Answers (4)

C-F
C-F

Reputation: 1768

Answering directly to OP's question: because there is a bug in the first code example.

You pass the iframe's document object to the parent's $ function. This does not make much sense.

  1. Parent's jQuery instance can not trigger event on DOM object of other window;

  2. Even if it could, it is an iframe's document, but you try to listen for the event on parent's document.

This would probably work:

window.parent.$(window.parent.document).trigger('complete');

Upvotes: 1

Alexander Todorov
Alexander Todorov

Reputation: 1

Check this solution, it's very tricky:

top.frames['frame_name'].document.getElementById('Processing').style.display = 'none'; 

Upvotes: -7

Ken Redler
Ken Redler

Reputation: 23943

You might try adding a triggering function in the parent document, then calling it as a regular function from the iframe. This should ensure you're triggering the event in the right document context.

// In Parent
function triggerComplete () {
  $(document).trigger('complete');
}

// In iFrame
window.parent.triggerComplete();

Upvotes: 13

moribvndvs
moribvndvs

Reputation: 42497

The way events are tracked, you can only trigger or receive events on the same document.

try

window.parent.$(window.parent.document).trigger('complete');

Upvotes: 45

Related Questions