Trouble getting events set with IE

W

whmoseley

I'm using the Prototype library for ajax calls. (Yes, I'm aware of the
discussions about prototype lately). Perhpas it's the library that's
causing problems, but I'm more suspct of my own code at this point in
my javascript learning curve.

Here's the test page with inlined javascript:

http://hank.org/demos/ajax3.html

Works in Firefox and Opera. Safari sees the onclick events, but then
runs the default action (follows the link). IE doesn't run the event
handler at all, although as seen with the alerts, it's running the code
to set the events.

The inital goal was to separate the html from the javascript -- that
is, avoid using inline onclick events in the html.

The code is suppose to find all elements with class "ajaxtarget" --
that is the container that is replace by the ajax call. The events to
set are then found by looking for class="ajax" within that outer
target.

Upon an oclick event (before making the ajax call) the code removes the
events. From what I've read that's needed to keep IE from leaking
memory. After the DOM is updated the process of adding the onclick
events is repeated to reset the events.

At this point I'm looking for help to get the code working, if
possible, with IE and Safari.

Thanks,
 
P

petermichaux


You could also get rid of a bunch of all styles and a bunch of html
tags and still have the problem? None of this stuff should be causing
the problem so removing it will help isolate things.

You mentioned that there was a problem with Safari. I cut the code down
even more and just tried the following in Safari 1.3.2 on OS X 10.3.9
and it worked fine. Also works in Firefox 1.5. By fine I mean I saw
both alerts.

If this works in your browsers try building the code back up until it
breaks. This will give better clues to which line is causing problems.

Peter


<html>
<head>
<script type="text/javascript" src="proto/prototype.js" ></script>
</head>

<body>
<a id="foo" style="cursor:pointer;">Click me!</a>

<script type="text/javascript">
var Updater = {
init: function () {
var el = $('foo');
var my_event = function(e) {
alert('got click ');
Updater.click(e);
};
Event.observe( el, 'click', my_event, false );
},

click: function(event) {
alert('received click on element href=' +
event.currentTarget.id );
return false;
}
};

Updater.init();

</script>

</body>
</html>
 
T

Thomas 'PointedEars' Lahn

I'm using the Prototype library for ajax calls. (Yes, I'm aware of
the discussions about prototype lately).

My sincere condolences nevertheless.
Perhpas it's the library that's causing problems, but I'm more suspct of
my own code at this point in my javascript learning curve.

Your code is syntactically correct. So either the library is buggy
(surprise!), or you are using it wrong. The best thing you can do
at this point of your learning curve is to avoid code that you do not
understand. (Which in this case is code that not even experts fully
understand, because Prototype is simply a load of completely
undocumented, unsupported, clueless junk.)


PointedEars
 
W

whmoseley

Of course, it's hard to argue logic with someone with pointed ears, but
the code is only using Event.observe and, as you must have seen from my
previous post, the event is working (so Event.observer is working)
because the first alert() displays, then then the second alert()
fails. So in this case it does not seem to be related to any junk in
Prototype. Not that Event.observe() does anything complex.

But, let's assume you are right anyway.
http://hank.org/demos/ajax5.html is a version without prototype that
also doesn't work in the same way on IE. "Updater.click(e)" is perhaps
not the correct way to call that when using IE?

Or maybe it's just my version of IE? I only have 6.02/Win98 and
5.2/Mac to test on.
 
P

petermichaux

No, that does not work in IE. It's basically the same code as my
previous post.

That means the problem is closer to being isolated since my code was
less than yours. Keep removing code until the problem dissappears.
After add things in and experiment to see what causes the problem

Peter
 
W

whmoseley

Ok, I reduced it down to:

<script type="text/javascript">
alert('it works!');
</script>

And that seems to work.

I'm not sure what you want me to remove at this point. It's down to a
single call that's failing.

var Updater = {
init: function () {
var el = $('foo');
var my_event = function(e) {
alert('got click '); // *** This happens ***
Updater.click(e); // *** This doesn't happen in IE ***
};
Event.observe( el, 'click', my_event, false );
},

click: function(event) {
alert('received click on element href=' +
event.currentTarget.id );
return false;
}
};
 

Ask a Question

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

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,015
Latest member
AmbrosePal

Latest Threads

Top