• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 243
  • Last Modified:

Problem with window & control focus/blur events


Hi,

I've been trying to create a popup window with javascript that always stays on top (window.focus() in onBlur event).
I've managed to do so but now I have to be able to enter some data in that popup by the use of a textfield (or anything like it).

This seems to be impossible to do.

The problem is that when the onFocus event of the textfield is triggered the window.onBlur event takes back focus to the window so nothing can be entered in the textfield.
I tried stopping this by setting a boolean to false in the textfields onFocus event so the window doesn't take focus.
This doesn't work.
It looks like the boolean set in the textfields onFocus event isn't set when I check it in the window.onBlur event.

If anyone knows how to solve this, or has an explanation for this problem, I'd love to hear it.

I've inserted the html-page I've been using for testing the problem rigth here :

-----------------start of code---------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
<title>Launch popup window</title>

<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--

var getfocus=true; // grab window focus?

function edit_onfocus() {
 
  getfocus=false;  
  lstevent.value = "edit_onfocus()\n" + lstevent.value
 
}

function edit_onblur() {

  getfocus=true;
  lstevent.value = "edit_onblur()\n" + lstevent.value
 
}

function button1_onclick() {

  getfocus=!getfocus
  lstevent.value = "getfocus=" + getfocus + "\n" + lstevent.value

}

function window_onblur() {

  lstevent.value = "window_onblur()\n" + lstevent.value
  if (getfocus) {
    window.focus ();  
  }
 
}

function button2_onclick() {
 
  lstevent.value = "";
 
}

//-->
</SCRIPT>
</head>
<BODY LANGUAGE=javascript onblur="return window_onblur()">
<INPUT type="button" value="switch getfocus" id=button1 name=button1 LANGUAGE=javascript onclick="return button1_onclick()">
<br>
Try to enter text in this box : <input type="text" name="edit" LANGUAGE=javascript onfocus="return edit_onfocus()" onblur="return edit_onblur()">

<p>

Events:<br>
<TEXTAREA rows=10 cols=40 id=lstevent name=lstevent>
</TEXTAREA>
<INPUT type="button" value="Clear" id=button2 name=button2 LANGUAGE=javascript onclick="return button2_onclick()">
</body>
</html>
---------------- end of code -------------------

have fun,
see ya.

0
newjack
Asked:
newjack
1 Solution
 
djbusychildCommented:
seems to work for me..

<html>
<head>
<script>
var typing=0;
function setTyping()
{
typing=1;
}
function getWindowFocused()
{
if (typing==1) {
      return true;
}
focus();
}

</script>
</head>
<body onblur=getWindowFocused()>
<form method=post action=#>
<input  onfocus=setTyping() type=text name=hello>
</form>
</body>
</html>

0
 
newjackAuthor Commented:

Btw, I'm testing this on IExplore v4 & v5.

It seems to work indeed, but I have to click on the edit box twice before I can enter anything.

This is the same problem I'm having, one way or the other it doesn't work from the first time.

The problem is I also set the switch back when I get an onBlur in the entryfield to make sure the window stays on top at all time (this is not the case in the example posted by djbusychild) making it impossible to enter data.
0
 
nettromCommented:
The onblur-focus() hack has it's problems, yes... Have you read Danny Goodman's modal dialog article? http://developer.iplanet.com/viewsource/goodman_modal/goodman_modal.html
0
 
CJ_SCommented:
what you might want to do is to call a javascript function in the onblur() of the window. That function will loop through all items INSIDE that HTML page, if there IS an item which has the focus at that exact moment then you don't do the window.focus.....if there is no object inside the html page which has the focus you just focus the window again....

shouldn't be too hard to implement.
0
 
CJ_SCommented:
That'd be like changing your function to:

function window_onblur()
{
  var IsInWindow;
  for(i=0;i<document.all.length;i++)
  {
     if(document.all(i).focus)
        IsInWindow = 1;
  }
  if(!IsInWindow)
     window.focus()  
}
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now