JavaScript trigger an AngularJS input change event from external JavaScript
Use the dispatchEvent
JavaScript function to trigger a form field's input event on a page that is using Angular.
This "input" trigger event was needed on an Angular 9.1.12 page:
function triggerInput(element) {
element.dispatchEvent(
new window.Event('input', { bubbles: true })
);
}
Usage:
var nameInputField = document.querySelector('#name');
nameInputField.value = 'Alice';
triggerInput(nameInputField);
Other events may be similarly triggered:
function triggerMouseEvent(element, eventType) {
var clickEvent = document.createEvent('MouseEvents');
clickEvent.initEvent(eventType, true, true);
element.dispatchEvent(clickEvent);
}
var myButton = document.querySelector('button');
triggerMouseEvent(myButton, 'mousedown');
triggerMouseEvent(myButton, 'mouseup');
2 comments
Thank you so much for this!!!
you're welcome!
Leave a Reply