IE: Change Event und Autocompletion

Im IE (7) gibt es Probleme mit dem Change-Event bei einem Input-Feld, wenn dies auch Autocompletion von script.aculo.us[1] beinhaltet.

Wird ein Input-Feld bezüglich den Veränderungen beobachtet ($('field').observe('change', ...')) wird beim IE dieser Event dann gefeuert, wenn der Focus das Feld verlässt.

Hat das Input-Feld nun auch Autocompletion, wird dieser Event nicht mehr gefeuert, wenn, der Nutzer mit Tab oder Enter ein Eintrag aus der Autocompletion-Liste auswählt.

Hier muss man den Event selbst feuern, wenn der Eintrag aus der Autocompletion-Liste ausgewählt wurde. Da man bei Prototype keine native Events abfeuern kann, nutzt man die eigenen Events [2] nutzen.

script.aculo.us Autocompletion ruft die Funktion selectEntry wenn ein Eintrag ausgewählt wurde. Nun kann man diese Funktion überschreiben und nach der Auswahl das nötige Event feuern. Natürlich nur beim IE ansonsten hat man das Event doppel. In dem folgenden Listing wird dies beispielhaft für Autocompleter.Local gemacht

var al = new Autocompleter.Local('field', 'auto_box', localResults, { }); // overwrite the selecEntry() function to fires the change event in IE al.selectEntry = function() { // the next two lines are the same from the original function! this.active = false; this.updateElement(this.getCurrentEntry());

   // the additional functionality
   // fire the event only for IE, cause IE does not fire this existing change event
   if(Prototype.Browser.IE) {
      var elem = $('field');
      elem.fire('clazz:event', ...);
   }

};

Links: [1] script.aculo.us [2] Prototype Element.fire