Fire Native Browser Event

[Dean]

Hi Prototype people

Is there a good way to fire the browser's native onchange event?
Here's my situation.

I am using prototype and lowpro. I have a text input box and some
divs. When the user mousedown's on one div, numbers in the input box
start changing. onmouseup, the numbers stop changing. I would also
like to alert the form that one of its inputs has changed.

Here are some simplified snippets of the lowpro Behavior class I
created to do the heavy lifting:

doIncrement : function()
{ newVal = 1 * this.inputBox.value;
newVal = newVal + 0.1;
newVal = newVal.toFixed(1);
this.inputBox.value = newVal;
this.timeoutEvent = setTimeout( this.doIncrement.bind(this), 150 );
},

onmousedown : function(evt)
{ this.doIncrement();
},

onmouseup : function(evt)
{ clearTimeout( this.timeoutEvent );
this.inputBox.focus();
}

Since I explicitly set the input's value with this.input.value =
newVal; the onchange event does not trigger (in Firefox 2.0.0.12 for
linux).

I am sprinkling these input into different forms that I need to inform
of changes, so calling a custom function in onmouseup() won't do the
trick.

It appears that jQuery can do it, and from what I gather in its
source, they eventually just do elem["change"](); but that throws an
"is not defined" error.

Any suggestions?

Regards,
--Dean

[kangax]

Custom events could help:

// use custom event as a proxy
$(someInput).observe('change', function()
{ this.fire('content:changed') });
...
doIncrement : function() {
this.inputBox.setValue((parseFloat($F(this.inputBox)) +
0.1).toFixed(1));
// fire custom event
this.inputBox.fire('content:changed');

this.timeoutEvent = setTimeout( this.doIncrement.bind(this), 150 );
},

...
// observe custom "content:changed" instead of "change"
$(somInput).observe('content:changed', function(e) {
// do stuff
})

You could also take a look at Event#simulate
http://github.com/kangax/protolicious/tree/master/event.simulate.js

- kangax

[Dean]

On Jun 17, 8:30 pm, kangax <kan...@gmail.com> wrote:
> Custom events could help:
>
> // use custom event as a proxy

This is what I ended up doing. I will keep an eye out for
Event#simulate.

Thanks for the help.

--Dean

> $(someInput).observe('change', function()
> { this.fire('content:changed') });
> ...
> doIncrement : function() {
> this.inputBox.setValue((parseFloat($F(this.inputBox)) +
> 0.1).toFixed(1));
> // fire custom event
> this.inputBox.fire('content:changed');
> this.timeoutEvent = setTimeout( this.doIncrement.bind(this), 150 );},
>
> ...
> // observe custom "content:changed" instead of "change"
> $(somInput).observe('content:changed', function(e) {
> // do stuff
>
> })
>

> You could also take a look at Event#simulatehttp://github.com/kangax/protolicious/tree/master/event.simulate.js