How to Update a Div Only When Window Receives Focus

Discussion in 'Javascript' started by zacware, Sep 11, 2006.

  1. zacware

    zacware Guest

    I have an AJAX enabled page which contains a list of records out of a
    database which are loaded into a div via an AJAX call.

    If the user switches to another window, and comes back to this open
    window later on, I want the list of records to be udpated when the
    window is back in front

    a simple onFocus doesn't work, as what happens is that if a button is
    clicked on the window it causes the onfocus to fire as well

    I've tried (unsuccessfully) to block onfocus events from reaching the
    window object from other objects (like buttons or images), but I can't
    seem to get this to work

    I just want the div to reload if the window gains focus!!!!!

    there is surely something simple I am missing????
     
    zacware, Sep 11, 2006
    #1
    1. Advertising

  2. zacware

    VK Guest

    zacware wrote:
    > If the user switches to another window, and comes back to this open
    > window later on, I want the list of records to be udpated when the
    > window is back in front


    Then you need to monitor window.onfocus/onblur, not your div.

    function notifyListeners() {
    // update your DIV's
    }

    window.onfocus = notifyListeners;
     
    VK, Sep 11, 2006
    #2
    1. Advertising

  3. zacware

    McKirahan Guest

    "zacware" <> wrote in message
    news:...
    > I have an AJAX enabled page which contains a list of records out of a
    > database which are loaded into a div via an AJAX call.
    >
    > If the user switches to another window, and comes back to this open
    > window later on, I want the list of records to be udpated when the
    > window is back in front
    >
    > a simple onFocus doesn't work, as what happens is that if a button is
    > clicked on the window it causes the onfocus to fire as well
    >
    > I've tried (unsuccessfully) to block onfocus events from reaching the
    > window object from other objects (like buttons or images), but I can't
    > seem to get this to work
    >
    > I just want the div to reload if the window gains focus!!!!!
    >
    > there is surely something simple I am missing????



    Will this help? Watch for word-wrap.

    <html>
    <head>
    <title>winfocus.htm</title>
    <script type="text/javascript">
    function fokus() {
    document.getElementById("when").innerHTML = new Date();
    }
    window.onload = fokus;
    window.onfocus = fokus;
    </script>
    </head>
    <body>
    <div id="when" style="font-family:Arial"></div>
    </body>
    </html>
     
    McKirahan, Sep 11, 2006
    #3
  4. zacware

    zacware Guest

    that's what I've done, the problem is that if I click on a button on
    that page, the onfocus event from the button bubbles up to the window
    object and refreshes the page too

    I seem to have an event bubbling problem, and I am trying to figure out
    how to only reload the div when the onfocus event is specifically
    because of the window getting focus rather than a child element of the
    window getting focus and trickling the event down to the window object.


    McKirahan wrote:
    > "zacware" <> wrote in message
    > news:...
    > > I have an AJAX enabled page which contains a list of records out of a
    > > database which are loaded into a div via an AJAX call.
    > >
    > > If the user switches to another window, and comes back to this open
    > > window later on, I want the list of records to be udpated when the
    > > window is back in front
    > >
    > > a simple onFocus doesn't work, as what happens is that if a button is
    > > clicked on the window it causes the onfocus to fire as well
    > >
    > > I've tried (unsuccessfully) to block onfocus events from reaching the
    > > window object from other objects (like buttons or images), but I can't
    > > seem to get this to work
    > >
    > > I just want the div to reload if the window gains focus!!!!!
    > >
    > > there is surely something simple I am missing????

    >
    >
    > Will this help? Watch for word-wrap.
    >
    > <html>
    > <head>
    > <title>winfocus.htm</title>
    > <script type="text/javascript">
    > function fokus() {
    > document.getElementById("when").innerHTML = new Date();
    > }
    > window.onload = fokus;
    > window.onfocus = fokus;
    > </script>
    > </head>
    > <body>
    > <div id="when" style="font-family:Arial"></div>
    > </body>
    > </html>
     
    zacware, Sep 11, 2006
    #4
  5. zacware

    McKirahan Guest

    "zacware" <> wrote in message
    news:...
    > that's what I've done, the problem is that if I click on a button on
    > that page, the onfocus event from the button bubbles up to the window
    > object and refreshes the page too
    >
    > I seem to have an event bubbling problem, and I am trying to figure out
    > how to only reload the div when the onfocus event is specifically
    > because of the window getting focus rather than a child element of the
    > window getting focus and trickling the event down to the window object.



    This example doesn't have that problem.
    Could you provide one that does?

    <html>
    <head>
    <title>winfocus.htm</title>
    <script type="text/javascript">
    function fokus() {
    document.getElementById("when").innerHTML = new Date();
    }
    window.onload = fokus;
    window.onfocus = fokus;
    </script>
    </head>
    <body>
    <div id="when" style="font-family:Arial"></div>
    <br><br><br>
    <input type="button" value="clicking doesn't reload page">
    </body>
    </html>
     
    McKirahan, Sep 11, 2006
    #5
  6. zacware

    zacware Guest

    add an img tag with an onclick handler in it, when you click on the
    image the window's focus event will fire and the date will update

    McKirahan wrote:
    > "zacware" <> wrote in message
    > news:...
    > > that's what I've done, the problem is that if I click on a button on
    > > that page, the onfocus event from the button bubbles up to the window
    > > object and refreshes the page too
    > >
    > > I seem to have an event bubbling problem, and I am trying to figure out
    > > how to only reload the div when the onfocus event is specifically
    > > because of the window getting focus rather than a child element of the
    > > window getting focus and trickling the event down to the window object.

    >
    >
    > This example doesn't have that problem.
    > Could you provide one that does?
    >
    > <html>
    > <head>
    > <title>winfocus.htm</title>
    > <script type="text/javascript">
    > function fokus() {
    > document.getElementById("when").innerHTML = new Date();
    > }
    > window.onload = fokus;
    > window.onfocus = fokus;
    > </script>
    > </head>
    > <body>
    > <div id="when" style="font-family:Arial"></div>
    > <br><br><br>
    > <input type="button" value="clicking doesn't reload page">
    > </body>
    > </html>
     
    zacware, Sep 11, 2006
    #6
  7. zacware

    McKirahan Guest

    "zacware" <> wrote in message
    news:...
    > add an img tag with an onclick handler in it, when you click on the
    > image the window's focus event will fire and the date will update


    It didn't for me under IE5.5 but under Firefox it updates the time
    wherever I click on the page.

    <html>
    <head>
    <title>winfocus.htm</title>
    <script type="text/javascript">
    function click() {
    alert("click!");
    }
    function fokus() {
    document.getElementById("when").innerHTML = new Date();
    }
    window.onload = fokus;
    window.onfocus = fokus;
    </script>
    </head>
    <body>
    <div id="when" style="font-family:Arial"></div>
    <br><br><br>
    <img src="clear.gif" border="1" width="20" height="20" onclick="click()">
    </body>
    </html>

    What browser (and version) are you testing with?
     
    McKirahan, Sep 11, 2006
    #7
  8. zacware

    zacware Guest

    FireFox 1.5, so I guess this is a browser specific issue!


    McKirahan wrote:
    > "zacware" <> wrote in message
    > news:...
    > > add an img tag with an onclick handler in it, when you click on the
    > > image the window's focus event will fire and the date will update

    >
    > It didn't for me under IE5.5 but under Firefox it updates the time
    > wherever I click on the page.
    >
    > <html>
    > <head>
    > <title>winfocus.htm</title>
    > <script type="text/javascript">
    > function click() {
    > alert("click!");
    > }
    > function fokus() {
    > document.getElementById("when").innerHTML = new Date();
    > }
    > window.onload = fokus;
    > window.onfocus = fokus;
    > </script>
    > </head>
    > <body>
    > <div id="when" style="font-family:Arial"></div>
    > <br><br><br>
    > <img src="clear.gif" border="1" width="20" height="20" onclick="click()">
    > </body>
    > </html>
    >
    > What browser (and version) are you testing with?
     
    zacware, Sep 12, 2006
    #8
  9. zacware

    McKirahan Guest

    "zacware" <> wrote in message
    news:...
    > FireFox 1.5, so I guess this is a browser specific issue!


    Don't run this under Firefox....
    You'll have to use Ctrl+Alt+Delete to end the task!

    <html>
    <head>
    <title>winfocus.html</title>
    <script type="text/javascript">
    function click() {
    alert("click");
    }
    function fokus1() {
    alert("onload");
    document.getElementById("when").innerHTML = new Date();
    }
    function fokus2() {
    alert("onfocus");
    document.getElementById("when").innerHTML = new Date();
    }
    window.onload = fokus1;
    window.onfocus = fokus2;
    </script>
    </head>
    <body>
    <div id="when" style="font-family:Arial"></div>
    <br>
    <img src="clear.gif" border="1" width="20" height="20" onclick="click()">
    </body>
    </html>
     
    McKirahan, Sep 12, 2006
    #9
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Lamont Adams
    Replies:
    1
    Views:
    771
    Lamont Adams
    Sep 10, 2004
  2. Replies:
    0
    Views:
    1,377
  3. Markus Dehmann
    Replies:
    4
    Views:
    262
    Puppet_Sock
    Jan 25, 2008
  4. Andre
    Replies:
    13
    Views:
    779
    CBFalconer
    Nov 30, 2008
  5. Roger
    Replies:
    3
    Views:
    336
Loading...

Share This Page