Click event added to parent iframe(body) not working in child iframe(body)

934 Views Asked by At

I have requirement where I need to detect inactivity of web page and if user is inactive for more than 15 min then user should be logged out.For this purpose I am trying to detect inactivity of user by attaching click/keypress events to whole whole page and also for the main iframe.

The problem here is I am able to detect keypress / click event on the main page (main iframe) but wherever showDialoge(another iframe), I am not able to detect this event. Even though this events are being added to body of main iframe and also to whole web page, somehow i am not able to detect the same.Please help.

I am using OpenText Cordys framework XFORMs / JavaScript.

No jquery as of now but if required I can used.

3

There are 3 best solutions below

2
On

If I understand your issue it has to do with event propagation. I'll admit though that I am less familiar with iframes. See this other post. What is event bubbling and capturing?

Aside from your question, ideally you should manage this via sessions. Expire the session after 15min. If the user is not authorized, aka not logged in, send them to the main page.

6
On

If your files are on same server, you can call parent window's function from child iframe like

parent.html

<script>
window.whichKey = function(keycode) {
    console.log("I'm called from child frame, you pressed " + keycode);
}
</script>

child.html

<script>
window.onkeypress = function(event) {
    window.parent.window.whichKey(event.keyCode);
} 
</script>

The other possible solution for your case is passing a variable in the url of parent from your child iframe. For example window.top.location.href = "parent.html?inactive=true"; and in the parent window you can check for this variable and perform required action.

This is how you can bind an event from parent to child frame's body for listening keypress using jQuery

$("#child-frame").bind("load", function(){
    $(this).contents().find("body").on('keypress', function(e) {
        console.log(e.keyCode);
    });
});
0
On

system.windows will return you the window objects of the opened applications. You can attach the event handler to all windows and do it.