event bubbling

Discussion in 'Javascript' started by Chris W, Jul 30, 2011.

  1. Chris W

    Chris W Guest

    Hello everyone,

    I've been trying to understand even bubbling, and not quite sure I
    completely follow it. I started reading about it so that I could
    warn users when they were leaving a page on my website if they had
    started to enter data into a form.

    I initially used the following used the following code based on [1]

    var entereddata = false;

    $(document).ready(function()
    {
    $('#contactform').bind('keypress',function(e) {
    if((e.which > 96 && e.which < 123) || (e.which > 47 && e.which <
    58)) {
    entereddata = true;
    //alert(e.which);
    }
    });
    });

    function goodbye(d,e) {
    if(!e) e = window.event;
    if(!d) d = entereddata;

    if(d)
    {
    e.cancelBubble = true;
    e.returnValue = 'You sure you want to leave?'; //This is displayed
    on the dialog

    //e.stopPropagation works in Firefox.
    if (e.stopPropagation) {
    e.stopPropagation();
    e.preventDefault();
    }
    }
    }
    window.onbeforeunload=goodbye;

    but, this didn't work in Chrome. After a bit of googling and hacking
    apart other code I found, I've found that this seems to work and is
    cross-browser compatible:

    var entereddata = false;

    $(document).ready(function()
    {
    $('#contactform').bind('keypress',function(e) {
    if((e.which > 96 && e.which < 123) || (e.which > 47 && e.which <
    58)) {
    entereddata = true;
    //alert(e.which);
    }
    });
    });

    function confirmLeave(e, d)
    {
    if(!e) e = window.event;//window.event;
    if(!d) d = entereddata;

    var confirmationMessage = 'It appears you have started to enter
    information into the contact form, but have not yet submitted it';

    if(!d)
    {
    e.cancelBubble = true;
    } else
    {
    return confirmationMessage;
    }
    }

    window.onbeforeunload=confirmLeave;

    This works like I want. But, if enteredData is true, then I'm not
    affecting the bubbling process. Should I be? Should I have
    e.cancelBubble=false if enteredData is false and e.cancelBubble=true
    if enteredData is true? What effect does setting the value of
    e.cancelBubble actually have when closing a page?

    Am I also correct in thinking I don't need the event e.stopPropagation
    at all, because firefox supports event bubbling?

    Thanks in advance,
    Chris

    [1] http://www.openjs.com/scripts/events/exit_confirmation.php
     
    Chris W, Jul 30, 2011
    #1
    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. S. Justin Gengo

    Re: Bubbling Event ---- Problem!!!!

    S. Justin Gengo, Jul 20, 2003, in forum: ASP .Net
    Replies:
    3
    Views:
    485
    Makarand
    Jul 24, 2003
  2. Barry

    Event Bubbling from a template

    Barry, Aug 7, 2003, in forum: ASP .Net
    Replies:
    0
    Views:
    373
    Barry
    Aug 7, 2003
  3. Nathan Sokalski

    Event Bubbling and the ItemCommand Event

    Nathan Sokalski, May 29, 2006, in forum: ASP .Net
    Replies:
    0
    Views:
    417
    Nathan Sokalski
    May 29, 2006
  4. Nathan Sokalski

    Event Bubbling and the ItemCommand Event

    Nathan Sokalski, May 29, 2006, in forum: ASP .Net Datagrid Control
    Replies:
    0
    Views:
    154
    Nathan Sokalski
    May 29, 2006
  5. Nathan Sokalski

    Event Bubbling and the ItemCommand Event

    Nathan Sokalski, May 29, 2006, in forum: ASP .Net Web Controls
    Replies:
    0
    Views:
    156
    Nathan Sokalski
    May 29, 2006
Loading...

Share This Page