Connecting Tech Pros Worldwide Help | Site Map

Watch for form element value change

VA
Guest
 
Posts: n/a
#1: Dec 24 '05
Mozilla-based browsers have watch and unwatch methods to detect change
in value of form elements (or any Javascript variables really). IE
doesn't support this.

Is there a a reliable cross-browser way alternative to this? Something
that will let me detect a change in value for a form element and
trigger my own callback function upon change?

Hopefully, something that is generic enough to be called as
"MyWatch(element)"!

Thanks for any help or pointers.

Michael Winter
Guest
 
Posts: n/a
#2: Dec 24 '05

re: Watch for form element value change


On 24/12/2005 18:39, VA wrote:
[color=blue]
> Mozilla-based browsers have watch and unwatch methods to detect
> change in value of form elements (or any Javascript variables
> really). IE doesn't support this.[/color]

Nor do most browsers.
[color=blue]
> Is there a a reliable cross-browser way alternative to this?[/color]

The change event?
[color=blue]
> Something that will let me detect a change in value for a form
> element and trigger my own callback function upon change?[/color]

The change event?
[color=blue]
> Hopefully, something that is generic enough to be called as
> "MyWatch(element)"![/color]

A function could be written to attach a predefined listener to a given
element. For instance:

function myListener() {
/* Do stuff here, using this operator to refer to element. */
}

function watchControl(ref) {
ref.onchange = myListener;
}

Mike

--
Michael Winter
Prefix subject with [News] before replying by e-mail.
VA
Guest
 
Posts: n/a
#3: Dec 25 '05

re: Watch for form element value change


Michael: Yes, I am aware of the onChange event but that would be fired
only when the user manually enters the field, changes its value and
steps out of it.

I am interested in firing my own callback function whenever the *value*
of the item changes, regardless of how it is changed. Either manually
by the user or by some other function by doing, for instance,
document.getElementById('myelement').value="newval ue"

[The Mozilla "watch" method does exactly this which is why I mentioned
it]

Help? Thanks.

Martin Honnen
Guest
 
Posts: n/a
#4: Dec 25 '05

re: Watch for form element value change




VA wrote:

[color=blue]
> I am interested in firing my own callback function whenever the *value*
> of the item changes, regardless of how it is changed.[/color]

IE in its DOM has onpropertychange as an event handler to be fired if
properties of a DOM element are changed:
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/events/onpropertychange.asp>
It will be fired when various properties are changed, to find out
whether the value property has been changed you then need to check
event.propertyName

--

Martin Honnen
http://JavaScript.FAQTs.com/
Michael Winter
Guest
 
Posts: n/a
#5: Dec 26 '05

re: Watch for form element value change


On 24/12/2005 23:52, VA wrote:

[snip]
[color=blue]
> Either manually by the user[/color]

Use the change event here,
[color=blue]
> or by some other function by doing, for instance,
> document.getElementById('myelement').value="newval ue"[/color]

and call the listener here yourself. I admit that it's not a very nice
solution, but it's about as cross-browser as you're going to get.

[snip]

Mike

--
Michael Winter
Prefix subject with [News] before replying by e-mail.
VA
Guest
 
Posts: n/a
#6: Dec 26 '05

re: Watch for form element value change


Michael Winter wrote:[color=blue][color=green]
> > or by some other function by doing, for instance,
> > document.getElementById('myelement').value="newval ue"[/color]
>
> and call the listener here yourself[/color]

But that's the whole point. The value of the item is changed in many
different places by many different scripts, having to hunt down each
instance of this change and manually calling the onchange listener is
not feasible. Hence, my quest to find an automated way to do this
regardless of how/where the value is changed.

onPropertyChange sounds good, but it is IE-only and even there it
doesn't quite work properly. The example given on that MSDN page Martin
pointed me to doesn't work. It throws JS errors like (oProp not
defined, oSelect is not an object and stuff).

Looks like there is no good cross-browser solution to this problem.

Thanks.

Closed Thread