2
1

D
e
c
e
m
b
e
r

2
0
0
5

Clever DOM

It’s only the W3C DOM, but I like it. Convinced you can’t tell whether form content has been changed, without adding billions of onChange or onBlur events to each of your form elements?

One big web application we’re development gets around this problem by saving forms every time they are submitted. The trouble with this is that there’s a lot of time spent saving un-necessarily, and there is potential for saving an unchanged form over the top of changes made by someone else.

The W3C DOM however supports event bubbling, which means events propogate through the DOM hierarchy until captured by something. In addition, you can add multiple event handlers to the same event on an object. So, instead of ludicrous numbers of onChange tags, you can do something like this at the top of your page:

function markDirty() {
    document.sale_edit.dirty_b.value = 1;
}
document.addEventListener('change', markDirty, false); 

Anything that triggers an onChange event will set dirty_b to 1, and on the server you can check its value to decide whether to save the form. What’s more, any event handlers you already have associated with elements on a form will still be triggered, although the order of triggering is undefined.

Leave a Reply

copyright ©2006 and so on, ninthspace.org, except quotations, lyrics and some images which are the rights of their respective holders