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
– epascarello, Commented Oct 18, 2011 at 17:09
@GregThompson: I'm working in localhost for now, so I don't have any url to give you. — Marm
– Marm, Commented Oct 18, 2011 at 17:56

Community · Accepted Answer · 2017-05-23 11:47:58Z

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, 2017 at 11:47

CommunityBot

11 silver badge

answered Oct 18, 2011 at 17:09

Samuli Hakoniemi

19.1k1 gold badge64 silver badges79 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Marm Over a year ago

I'm not sure how to use mutation events properly, can you give an example? Is it compatible with all browsers?

Samuli Hakoniemi Over a year ago

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.

Marm Over a year ago

Thanks, but I cannot use jQuery in my project.

Marm · Accepted Answer · 2011-10-20 18:02:01Z

0

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.

answered Oct 20, 2011 at 18:02

Marm

8732 gold badges15 silver badges31 bronze badges

Collectives™ on Stack Overflow

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

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related