Warning the user against navigating away

[Jonathan]

Okay, I know this is a PHP group, but I'm sure many of you turn to
Javascript for a multitude of tasks.

Here is my dilemma.

I am trying to warn the user against navigating away from the page if
they have typed in some text but not saved it.

I can do this with the onbeforeunload event:

var taintedText = false;

function displayWarningMessage()
{
if ( taintedText )
{
return "You have not saved your information.";
}
}

window.onbeforeunload = displayWarningMessage;

Something like this works fine in Firefox. I set taintedText to true
when the user starts putting information in.

However, the developer has chosen to make the form a collection of
AJAX inputs instead of an actual form. To update a piece of data on
the form, you click on a tiny edit link beside the field. A
javascript function is called, which transforms the field into a text
box with the field as its value.

This all works fine in Firefox, but in IE the onbeforeunload event is
called whenever you click on an anchor tag. So when you click edit,
IE asks if you really want to browse away from the page.

I've tried a number of different things to get around this. For
example, capturing the event in the displayWarningMessage and using
the event's target source field to determine if the edit link is
calling it. But the target source field is set to null in IE. It's
defined, it's just set to null.

Changing all the forms back into real forms isn't an option because it
would be a massive undertaking. Can anyone think of a way to escape
the onbeforeunload event for these links?

[trevor...@gmail.com]

Do the links have an id on them? If so you could check that to see if it's an edit link. If not, adding ids to the links would probably be much easier then changing it to a form :-)

Sent from my BlackBerry device on the Rogers Wireless Network

[Jonathan]

Nope, the links have no ids. I suppose document.getElementById
('edit_link').onbeforeunload = null might do the trick?

There's a bunch of these links all over the page. What I could do is
set them to a class and then disable the event on them using jquery in
one fell swoop.

It just seems like it should be so much easier. My current solution
involves a second toggling variable. While ugly, it saves me from
editing every page in the application and adding classes or ids to the
links.

(err on second thought, they already have classes to give them a
certain style -- using jquery might work)