One event handler provoking another

**Stephen Chalmers** · Jul 23 '05, 12:20 PM

Re: One event handler provoking another

"Clarence Gardner" <clarence@silco m.com> wrote in message
news:1224a8f9.0 407200911.80e47 1e@posting.goog le.com...[color=blue]
> I'm seeing surprising behavior, consistent across Opera, Firefox, and IE.
> An event handler is changing the value of an element, and there is[/color]
apparently[color=blue]
> no Change event being generated for the element. A simple illustration is,
> make an INPUT element with an onchange; type in a new value, the Change
> event handler is called. But make a button whose Click handler changes the
> value, and the Change handler does not get called.
>
> It appears that events are not generated while an event handler is[/color]
running.[color=blue]
> Can this be true?[/color]

Under Mozilla, I achieved the desired effect by having the button first
focus the field to be changed,
then setting the new value, then changing the focus to another field.
It appears in this case to depend upon the browser's exact criteria for
triggering an onchange.
I.E. & Opera appear to insist upon the keyboard being involved, so you may
have to invent another
method to achieve what you want.

<HTML>
<BODY>


<FORM>
<INPUT value='0' type=text size=80 onchange='dfe[1].value+=" Top field
added me" '><- Change my
value, then blur me.<BR>

<INPUT type=text size=80 value=''><BR>

<INPUT type=button value="Change value of top field"
onmouseup='dfe[0].focus();dfe[0].value+=" Button

did this";dfe[0].blur()'><BR>

<INPUT type=reset value='Clear this mess'>
</FORM>

<SCRIPT>
var dfe=document.fo rms[0].elements;
</SCRIPT>

</BODY>
</HTML>

--
S.C.

**Grant Wagner** · Jul 23 '05, 12:20 PM

Re: One event handler provoking another

Clarence Gardner wrote:
[color=blue]
> It appears that events are not generated while an event handler is running.
> Can this be true?[/color]

It has nothing to do with whether the event handler is running or not.

Javascript may or may not fire events for things that happen programmaticall y.
Changing the value of an input programmaticall y does not trigger the onchange
event, issuing document.forms['formName'].submit() does not fire the onsubmit
event of the form (the exception being some versions of Opera, which _did_
incorrectly fire the onsubmit event of the form when calling it's submit()
method).

However, calling the click() method of a button causes that button's onclick
event to fire, and calling the focus() and blur() methods on an element both
cause the onfocus and onblur events to fire respectively.

Anyway, if you want to process the onchange event of an input after changing it's
value programmaticall y, the correct way to do it is as follows:

<script type="text/javascript">
function test(f) {
var theElement = f.elements['myInput'];
if (theElement) {
theElement.valu e = 123;
if (theElement.onc hange) {
theElement.onch ange();
}
}
}
</script>
<form name="myForm">
<input type="text" name="myInput" value="456"
onchange="alert ('myInput=' + (+this.value +1));">
<input type="button" name="myButton" value="Test" onclick="test(t his.form);">
</form>

Calling the onclick() method programmaticall y after changing the value
programmaticall y will have a much better chance of success then flipping the
focus around in an attempt to make the user agent trigger the event itself.

Of course, if you're already _in_ the onchange event when you do this, it would
be a good idea to include some way of preventing an endless loop, where the
onchange event changes the value, then calls the onchange event, which calls the
onchange event, etc.

--
Grant Wagner <gwagner@agrico reunited.com>
comp.lang.javas cript FAQ - http://jibbering.com/faq

**Clarence Gardner** · Jul 23 '05, 12:28 PM

Re: One event handler provoking another

Thanks, folks. Those were very good and helpful answers.

Before I saw them, I ended up changing the field from a regular text-type
to a radio button, and calling its click() method; I put the same code from
the text's onchange into the button's onclick.

Your answers made me realize why it didn't work in the first place, relating
to the standard's wording (paraphrased) that that onchange event is fired when
an element loses focus and its value is not the same as it was when it gained
the focus. I ASSUMED :(

Believe it or not, all I was actually trying to do was to get some code to
run in another window. I have window A loading a document into iframe B,
and A wants a function to run after B has loaded. It got convoluted because
of various things not working, (I don't remember the details). I wanted to
just call the function from the onload handler in B's document, but it's
apparently impossible to address a JavaScript function that way. (Even though
I regularly do so from one frame calling into another.) So I figured, if I
can't get to the function, I can get to an element over there that *can* get
to the function. Whew! Roundabout, but it works.

Thanks again for the great responses.

One event handler provoking another

One event handler provoking another

Comment

Comment

Comment