How to trigger an onChange event in HTML, even if the content is changed in js?

Question

I know the HTML onChange event is triggered only when the element is blurred.

But is there a way to run a script when the content of a textbox changes? Even if it is changed in Javascript?

I have a textbox in my form to select a date. I also have a button with a calendar to pick a date. This calendar writes in the textbox and I want to do something when the date changes.

I cannot change the Javascript of the calendar.

I also want compatibility with all major browsers (IE7-9, Firefox, Chrome, Safari, Opera, ...).

Does the calendar have an event to let you know something was selected? Well written components do. — epascarello, Oct 18 '11 at 17:09
@GregThompson: I'm working in localhost for now, so I don't have any url to give you. — Marm, Oct 18 '11 at 17:56

score 2 · Answer 1 · edited May 23 '17 at 11:47

2

You're looking for mutation events (eg. DomAttrModified).

See Detect element content changes with jQuery if that would help you as a starter.

edited May 23 '17 at 11:47

Community

1
1

answered Oct 18 '11 at 17:09

Samuli Hakoniemi

18,740
1
61
74

I'm not sure how to use mutation events properly, can you give an example? Is it compatible with all browsers? – Marm Oct 18 '11 at 17:39
No, they're not cross-browser but rather "new" implementation. However I think there are readily-made plugins / scripts to behave like mutations would behave. I've seen at least jQuery Mutation Events plugin. – Samuli Hakoniemi Oct 19 '11 at 05:57
Thanks, but I cannot use jQuery in my project. – Marm Oct 20 '11 at 18:03

score 0 · Accepted Answer · answered Oct 20 '11 at 18:02

I found an answer to my question wich is maybe not the better one, but still works. It uses javascript timers.

function watchElement()
{
    var newVal = document.FormName.TextboxName.value;
    if(oldVal != newVal) {FunctionToCall();}
    oldVal = newVal;
}

var oldVal = document.FormName.TextboxName.value;
setInterval(watchElement, 500);

I know this is not the better code in the world, but it works for every major browsers.

How to trigger an onChange event in HTML, even if the content is changed in js?

2 Answers2