onpropertychange for a textbox in Firefox?

Tushar Maru picture Tushar Maru · May 28, 2009 · Viewed 11.7k times · Source

How to handle the onpropertychange for a textbox in Firefox using JavaScript?

Below is an example:

var headerBGColorTextBox = document.getElementById('<%= tbHeaderBGColor.ClientID %>');

if (headerBGColorTextBox != null) {
  headerBGColorTextBox.pluggedElement = document.getElementById('<%= trHeaderBG.ClientID %>');
  headerBGColorTextBox.onpropertychange = function() {
    alert('function called');
    if (event.propertyName == 'style.backgroundColor' && event.srcElement.pluggedElement != null)
      alert(event.propertyName);
    event.srcElement.pluggedElement.style.backgroundColor = event.srcElement.style.backgroundColor;
  };
}

Answer

Christophe Ebl&#233; picture Christophe Eblé · May 28, 2009

There are two ways to mimic the onpropertychange event, Mutation events as mentioned above that should work equally across modern browsers and the "object.watch" non-standard method that will provide support for old versions of FF < 3.

See documentation on MDC.

Object.watch

Mutation events