?
Solved

onblur, onfocus not working iframe mozilla

Posted on 2006-04-21
13
Medium Priority
?
3,249 Views
Last Modified: 2008-01-09
I have the following code in my page:

  <iframe id="the_editor_x5" onblur="TestMe();" onfocus="loadAlert();" name="the_editor_x5" width="99%" height="99%" style="Background:white;"></iframe>


<textarea id="the_editorHtmlBox" runat="server" name="the_editorHtmlBox" class="" style="width:99%;font-size:10pt;font-family: Courier New, Courier;display:none" onchange="RTB_fromHTMLView('the_editor')"></textarea>
                        
<input id="the_editor" runat="server" enableviewstate="true" name="the_editor" type="hidden" value="&lt;p>&amp;nbsp;&lt;/p>" />

---------------

TestMe and loadAlert are two functions that simply call alerts. In IE, the alerts show up when I give focus to the iframe and take focus away. In Mozilla, the events never fire. Also, if I set the iframe's document.designMode etc to on, the events still don't fire in mozilla.

Does anyone have an idea as to why?
0
Comment
Question by:simsingh
  • 6
  • 4
  • 3
13 Comments
 
LVL 63

Expert Comment

by:Zvonko
ID: 16511849
Perhaps your loadAlert() does get a runtime error in Mozilla.
Do you use window.event reference in that functions?
window.event is not defined in Mozilla.


0
 
LVL 9

Expert Comment

by:smaccari
ID: 16511901
Maybe you should try to assign the handlers to the window object of the iframe element by script:

<iframe id="the_editor_x5" name="the_editor_x5" width="99%" height="99%" style="Background:white;"></iframe>
<script>
document.getElementById("the_editor_x5").contentWindow.onfocus=loadAlert;
document.getElementById("the_editor_x5").contentWindow.onblur=TestMe;
</script>
0
 

Author Comment

by:simsingh
ID: 16511916
no the content window onfocus onblur doesnt' work. Not doing any window.event stuff....

ITs really really strange....
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 9

Expert Comment

by:smaccari
ID: 16511976
Ok and what about this:

<iframe id="the_editor_x5" name="the_editor_x5" width="99%" height="99%" style="Background:white;"></iframe>
<script>
frames["the_editor_x5"].onfocus=loadAlert;
frames["the_editor_x5"].onblur=TestMe;
</script>

Doesn't it work at least in IE?
If it's working in IE and not FF, you should - as Zvenko supposed - look at your code in the handler.
window.event will not work with FF - nor Mozilla, nor Safari...
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 16512102
The events are realy not fired in Mozilla. Very strange.
0
 
LVL 9

Expert Comment

by:smaccari
ID: 16512117
Mmm.. do not have FF here (am on my HTPC)..
Both frames and contentWindow failed to fire the event in FF?
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 16512246
OK, I have tested your both proposals.
Both proposals work in IE.
The folowing proposal does not work at all in FF:
<script>
frames["the_editor_x5"].onfocus=loadAlert;
frames["the_editor_x5"].onblur=TestMe;
</script>

But the first one:
<script>
document.getElementById("the_editor_x5").contentWindow.onfocus=loadAlert;
document.getElementById("the_editor_x5").contentWindow.onblur=TestMe;
</script>

has an absolutely strange behavior.
On load of that page does not hapen anything. I mean you load the page and focus the iframe and leave the iframe and nothing happens and no errors.
But after that when you refresh the page does the onfocus event fire. Becaise the event  handler calls an alert() does the iframe loose the focus but does not call the onblur handler. After clicking OK in the alert does the iframe fire again the onfocus handler, does alert and so on in an infinite loop. You need then the three fingers catch to kill the show by task manager.



0
 
LVL 63

Expert Comment

by:Zvonko
ID: 16512252
OH, and it does not help to coment out the onfocus alert(); the onblur handler does not fire also without alert()

0
 
LVL 9

Expert Comment

by:smaccari
ID: 16512269
So is this behaviour different from the one you'd get by writing this?

window.onfocus=loadAlert;
window.onblur=TestMe;

(am sorry again just trying to understand - as you do ;) -, but not having FF under the hand for testing)
0
 

Author Comment

by:simsingh
ID: 16512296
Yeah its freak'n weird. No onfocus or onblur evetns fire. THE reason is that onblur, I want to copy the contents of the document to a textarea (to have a WYSYWIG editor). That didn't work in mozilla but worked great in ie. Thus, the testing I am doing with alerts and stuff, but basically, no onblur, or onfocus evetns fire...


0
 
LVL 63

Accepted Solution

by:
Zvonko earned 2000 total points
ID: 16512311
Yes, it is different.
And it does partialy make sense to me.
In IE you can assigne handlers for the emebeded window CONTENT.
In FF are this basic assignments overwritten by the real window empty handlers.
On reload or refresh does the FF has an side effect not to reload the window completely. Therefore are the handlers from parent window used as loaded handlers.

I mean this: in an iframe you have always problems with the events which function are located in parent window context. The event is fired in iframe window and the function is not defined in that iframe window context. You see?

The event handler defined in the iframe tage are an exception to that dilema; they are always fired in the parent window context, and thats the way how IE handles the onfocus and onblur of the iframe, but it is not realy consistant to me.

0
 

Author Comment

by:simsingh
ID: 16512313
okay, so while I don't have a solution, if you do "onsubmit" on the form itself, one can then achieve what i wanted to achieve.

So we don't need to worry about this anymore.

I will distribute points evenly between the contributors.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 16512341
Hello simsingh,
the solution for your copy (when you have read my upper explanation) is to define the focus and blur handlers in the iframe page, not in the parent page. Iframe page can call parent functions by prefixing the parent. reference to the calls.
Like this:
<body onFocus="parent.loadAlert()" onBlur="parent.TestMe()">
<h1>Iframe</h1>
</body>

0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question