call event from pure javascript registered by jquery

Question

I have a pure javascript control that does not rely on jquery which needs to raise an event. The event needs to be able to be bound and consumed by client pages that use jquery and this control. When raising the event through pure javascript, jquery does not see it. Please see this: http://jsfiddle.net/w5who6fr/

$(function () {
    $('#test').on('input', function () {
        alert('event triggered');
    });
});

// works
$('#test').trigger('input');

// does not work
document.getElementById('test').oninput();


<input id="test" />

what is `.oninput()`? if you created a function called that, please show that code. — yaakov, Jun 26 '15 at 19:56
See http://www.w3schools.com/jsref/event_oninput.asp for oninput event. But it doesn't work for any event like for example onchange — Perry, Jun 26 '15 at 19:59
This is a built in event. Its part of HTML5 spec. It is not a custom event created by me. — Perry, Jun 26 '15 at 20:01
Refer over here - http://stackoverflow.com/a/2856602/1132354 — Nikhil Aggarwal, Jun 26 '15 at 20:09

score 0 · Answer 1 · edited May 23 '17 at 11:51

0

It looks like oninput is not a function of a HTMLElement. Just use the JavaScript EventTarget.dispatchEvent() function.

$(function () {
    $('#test').on('input', function () {
        alert('event triggered');
    });
});

// works
$('#test').trigger('input');

var onInputEvent = new Event('input');
document.getElementById('test').dispatchEvent(onInputEvent);


<input id="test" />

I updated your fiddle.

EDIT:

Make sure to fire an event correctly based on browser (thanks IE).

edited May 23 '17 at 11:51

Community

1
1

answered Jun 26 '15 at 20:44

Ryan V

480
3
13

I see that you updated the fiddle but it still doesn't work. Run the fiddle yourself and see. Nothing gets raised. – Perry Jun 27 '15 at 01:49
BTW, I can't get it to work from any built in event. Try it even with the "click" event. It doesn't work. – Perry Jun 27 '15 at 01:54
I take it back. It works with "click". It does not work with "input" nor "change". – Perry Jun 27 '15 at 02:01
So no one can answer this seemingly simple question? – Perry Jun 30 '15 at 17:31

call event from pure javascript registered by jquery

1 Answers1