View Full Version : Need Clarification Concerning Events

10-15-2002, 09:39 PM
I'm getting into the DOM thing. Way cool... anyway...

I see that DOM handles events but I don't quite get "it." I understand that DOM does not directly support DHTML events - i.e. you cannot do this:

var mychkbox = createElement('input');

I'm trying to imagine DOM handles events somewhat generically kinda like a standard Mac GUI program - all events are passed to a general event handler and the handler figures out what kind of event it is and calls appropriate functions.

But I don't see how the script can see what specific element was clicked on - a specific checkbox for example.

What am I trying to do, you ask?
I'm dynamically creating table rows, each row has several fields constituting one data record. I want to default-disable a certain textbox (which I do), but I want to enable it when I click on it's associated checkbox. Easy in DHTML, is it possible in DOM?

10-15-2002, 10:09 PM
EventTarget.addEventListener('typeofevent', EventHandler, useCapture);

EventTarget is typically an element or document node (can be a text node). EventHandler is a reference to a function which takes a single argument (refering to the event object), and useCapture is a boolean for whether the listener should fire during the capturing or bubbling phase of the event.

10-17-2002, 05:29 PM
Uh, OK. What are the typeofevent(s)? In DHTML we specify "onclick", "onmouseover", etc. How do we tell DOM we're looking specifically for a click, then a click on a specific object - this checkbox? I can't find a list of what these event types are. Are they (duuuhhh) the exact type/spelling as with DHTML?

What I think I understand at this point
Please tell me where I'm going wrong; and fill in the blanks

Gotta create an event:
var clickEvent = DocumentEvent.createEvent("click"); // what are the different event types?

Then you gotta set some properties:
clickEvent.initEvent ('click', false, false); // "click" seems redundant! We alredy specified the event type when we created it.

Then you gotta tell what function to do when an event occurs:
write a function w/ a parameter that takes an Event object:
function checkboxEventHandler (clickEvent) {...}

Then you gotta register the event listener. This typically takes place when you create the object itself:
var myCheckbox = document.createElement ("checkbox");
myCheckbox.addEventListener (typeofevent, checkboxEventHandler, false); // AGAIN, how do you 'say' "a click event"?

Now, when the checkbox is clicked on the checkboxEventHandler function is called.

10-17-2002, 09:05 PM
// create a MouseEvent

You don't use the event name in that, only what event type it is going to inherit from.

For example the event 'load' is initialized by "HTMLEvents" in the argument.

Now, with the specific type of event, you initialize it with the event name, and some context info.

myMouseEvent.initEvent('click', blablablabla);

None of that though is required to setup an event listener. This rather progmatically creates events you can dispatch at will.

Anyway, just an example to setup an event listener for a click event:

function myListener(event) {
// do something!

myCheckBox.addEventListener('click', myListener, false);

10-18-2002, 06:30 PM
I'm not understanding something. Are you saying that I am to make up the event type myself? That makes no sense whatsoever. DOM must implement - OK the specific implimentation (NS 7.0, IE5.x, etc.) must implement the event types - Something has to. I can't make them up on the fly in script!?:(

I'm still left with the same question: "what are the events?" ie. "what events are supported?" ie "what are the different event types?". Sorry if I'm sounding rude here, but while the generic format for scripting events in DOM is needed, we're beating that dead horse too much.

A partial answer:

This is a list of all the events supported in Gecko. BUT this leaves the question of events supported in IE - specifically IE 5.5 (if any!).

I tried the demo code (see example 5):

While this code fully functions in Netscape 7.0 (macintosh - I take my iBook to work:thumbsup: ) it is not fully working in IE 5.5 (windoze 98). Specifically the "addEventListener" isn't executing. Maybe this property is not implemented. Maybe "click" is not a valid event. Apparently "onclick" is not either.

10-18-2002, 06:57 PM
Internet Explorer does not implement the DOM2 Events specifications. While it has several comparable properties of the event object, and a few methods which can achieve similar effects, its own event implementation is not compatible at all with DOM2's.

Namely, it doesn't support event capturing, it doesn't pass event objects around as arguments (always keeps it in global window.event), you can't progmatically create events, it doesn't have any DOM2 MutationEvents (onpropertychange is arguably a basic implementation of attrmodified), doesn't have several equivalent MouseEvents, etc. Too many differences to list really.

10-18-2002, 07:28 PM
So anyone know of a reference so I can find out what IE can do?

Please don't tell me to goto msdn.microsoft.com. I can't find *&%$ in that mess! If you know of a specific page in msdn, then OK.

10-18-2002, 07:44 PM
Well, there are a few basics I can list here:

addEventListener --> attachEvent(eventname, listener)
attachEvent always bubbles

detachEvent is the equivalent of removeEventListener

Events are "oneventname" instead of "eventname" in IE. somelement.attachEvent('onclick', doSomething);
for example.

Ummm, a list of events IE supports:

And a list of properties that can be found on window.event:

10-27-2002, 03:56 AM
A nice tutorial on the DOM event handlers and the differences between IE & NS6 when using them.