onchange and IE's AutoComplete don't mix

by @jehiah on 2005-09-29 19:23
Filed under: All, HTML, IE, Javascript

When you use IE's AutoComplete feature to fill in form information javascript onchange event's don't fire. Isn't that annoying?

You don't have to take my word for it though. Check it out on this example form

Things work fine with firefox's AutoComplete, but you are on your own with IE.

Update below is a behaviour script workaround using behaviour.js and prototype.js, and a page demoing the fix

[js]
var onchangeFix ={
   'input' : function(el){
        if (typeof(document.media)=='string' && el.getAttribute("type").toLowerCase() == "text"){ // ie domcheck and onchange
           el._onchangeFix = {};
       if (el.onchange){
              el._onchangeFix_onchange = el.onchange;
              el.onchange = function(){this._value = this.value;this._onchangeFix_onchange(this);}
       }
       else
          el.onchange = function(){this._value = this.value;}
           if (el.onclick){
          el._onchangeFix_onclick = el.onclick;
              el.onclick = function(){this._value = this.value;this._onchangeFix_onclick(this);}
           }
           else
              el.onclick = function(){this._value = this.value;}
           if (el.onblur){
          el._onchangeFix_onblur = el.onblur;
              el.onblur = function(){if (this._value != this.value){this.onchange();}el._onchangeFix_onblur(this);}
           }
           else
              el.onblur = function(){if (this._value != this.value){this.onchange();}}
        }
   }
};

Behaviour.register(onchangeFix);
[/js]

Note: because this behaviour script is nice and preserves existing onchange, onblur and onclick events; dont call Behaviour.apply(); because it will apply this fix twice (and so on and so forth). That'll do a nice job of making the browser slow!

Subscribe via RSS ı Email
© 2014 - Jehiah Czebotar