JQuery UI AutoFill - Unwanted due to special characters

Question

I have several auto-complete in my application. Some of them are loaded from the database at boot time. If the input value contains special characters, such as æøå, autocomplete starts the search even if I was not somewhere near the html input. This only applies to Internet Explorer 11 (and possibly below). In FF and Chrome, it works as you expected.

Consider the following input:

<input type='text' class'ac' value='chars æøå' />

When applying autocomplete to this input, where one of the possible search results matches the default value ("chars æøå"), the search will be initiated upon initialization.

JSfiddle here (use IE to see it on boot): http://jsfiddle.net/BY9gU/

I would LOVE to just ignore IE, but unfortunately some of my clients still use it ...

Any ideas for a workaround?

Answer 1

As @cverb says in his answer, this is an IE problem and cannot be blamed on the jQuery user interface. However, I made a workaround that seems to work fine, at least in my project:

Find this code in jquery ui source:

search: function( value, event ) {
    value = value != null ? value : this._value();

    // always save the actual value, not the one passed as an argument
    this.term = this._value();

    if ( value.length < this.options.minLength ) {
        return this.close( event );
    }

Change it to this (add if-block):

search: function( value, event ) {
    value = value != null ? value : this._value();

    // The following if-block is inserted by me as a workaround.
    // Add all characters which may cause you trouble in the
    // regex pattern.
    if ( this._value().match(/[æøåÆØÅ]/) && this.term === undefined ) {
        return;
    }

    // always save the actual value, not the one passed as an argument
    this.term = this._value();

    if ( value.length < this.options.minLength ) {
        return this.close( event );
    }

Voila! It works. I can not guarantee that I did not violate some other functions, but I am 99.9% sure that I do not :)

Answer 2

I had this problem a while ago, and I ended up doing the following in my html:

<input type='text' class'ac' data-value='chars æøå' />

:

   $("input").autocomplete({
        source: availableTags, 
        create: function(event, ui) {
            $(this).val(($(this).attr("data-value"))); 
        }
    });

, , value sspecial .

Answer 3

:

<meta http-equiv='X-UA-Compatible' content='IE=Edge'>

Answer 4

, .

, IE, jQuery, jQueryUI. , , - .

http://bugs.jqueryui.com/ticket/9796#no1