Skip to main content

Search and Top Navigation

#5933 closed bug (wontfix)

Opened August 12, 2010 06:54AM UTC

Closed November 22, 2010 07:57PM UTC

Last modified February 02, 2012 07:43AM UTC

Autocomplete: Doesn't work with IME (input method editor)

Reported by: xcl3721 Owned by:
Priority: major Milestone: 1.9.0
Component: ui.autocomplete Version: 1.8.4
Keywords: Cc:
Blocked by: Blocking:
Description

the chinese user find if you input a chinese the autocomplete compment will not work only.current they using keyborad with down key to select the opinion

forum post

Attachments (0)
Change History (20)

Changed August 12, 2010 09:04AM UTC by jzaefferer comment:1

I've read elsewhere that inputting chinese characters can require multiple keypresses per character. But that in itself shouldn't be a reason for the autocomplete to break. Can you provide some more detail on the issue? Without a chinese keyboard I have no idea how to test this.

Changed August 15, 2010 12:15PM UTC by xcl3721 comment:2

hi thank you

here is the code

 var availableTags = ["剧情","喜剧","动作","爱情","惊悚","短片","纪录片","犯罪","恐怖","冒险","悬疑","动画","家庭","战争","奇幻","科幻","歌舞","西部","音乐","传记","历史","运动","成人","古装","武侠","戏曲","黑色电影","儿童","情色","舞台艺术","美国","日本","中国","香港","法国","英国","意大利","德国","韩国","西班牙","加拿大","台湾","1999","2000","2001","2002","2003","2004","2005","2006","2007","2008","2009","2010","高清","普清","强烈推荐","频道推荐","经典推荐","分类推荐",];
	function split(val) {
		return val.split(/,\\s*/);
	}
	function extractLast(term) {
		return split(term).pop();
	}
	
	$("#mv_category").autocomplete({
		minLength: 0,
		source: function(request, response) {
			response($.ui.autocomplete.filter(availableTags, extractLast(request.term)));
		},
		focus: function() {
			return false;
		},
		select: function(event, ui) {
			var terms = this.value.split(/,\\s*/);
			for(i in terms)
			{
			      if(terms[i]==ui.item.value)return false;
			}
			terms.pop();
			terms.push( ui.item.value );
			terms.push("");
			this.value = terms.join(",");
			return false;
		}
	});

you can use past to test this :) good luck!

Changed August 15, 2010 12:17PM UTC by xcl3721 comment:3

and when i type chinese it'will not show the list

but if i input the backspace to chinese or space it's will show

hopefully

Changed August 17, 2010 05:45PM UTC by scottgonzalez comment:4

If I paste "剧" I get results. I don't know any other way to test this though.

Changed August 17, 2010 06:19PM UTC by scottgonzalez comment:5

resolution: → wontfix
status: newclosed

I figured out a way to actually type in Chinese characters on OS X. What I noticed is that Chrome doesn't trigger any key events, but does trigger an input event. Firefox doesn't trigger keydown or keyup, but does trigger keypress and input. I couldn't get the characters to even get typed in IE through Virtual Box. So the problem is that the browsers don't report the events and therefore I don't think this is a problem that we can fix.

Changed August 26, 2010 01:24AM UTC by Zeke comment:6

resolution: wontfix
status: closedreopened

I think we can let the keydown handler handles the control input while the keyup handler handles the character input.

Here is the original code:

.bind( "keydown.autocomplete", function( event ) {
	var keyCode = $.ui.keyCode;
	switch( event.keyCode ) {
	case keyCode.PAGE_UP:
		self._move( "previousPage", event );
		break;
	case keyCode.PAGE_DOWN:
		self._move( "nextPage", event );
		break;
	case keyCode.UP:
		self._move( "previous", event );
		// prevent moving cursor to beginning of text field in some browsers
		event.preventDefault();
		break;
	case keyCode.DOWN:
		self._move( "next", event );
		// prevent moving cursor to end of text field in some browsers
		event.preventDefault();
		break;
	case keyCode.ENTER:
	case keyCode.NUMPAD_ENTER:
		// when menu is open or has focus
		if ( self.menu.active ) {
			event.preventDefault();
		}
		//passthrough - ENTER and TAB both select the current element
	case keyCode.TAB:
		if ( !self.menu.active ) {
			return;
		}
		self.menu.select( event );
		break;
	case keyCode.ESCAPE:
		self.element.val( self.term );
		self.close( event );
		break;
	case keyCode.LEFT:
	case keyCode.RIGHT:
	case keyCode.SHIFT:
	case keyCode.CONTROL:
	case keyCode.ALT:
	case keyCode.COMMAND:
	case keyCode.COMMAND_RIGHT:
	case keyCode.INSERT:
	case keyCode.CAPS_LOCK:
	case keyCode.END:
	case keyCode.HOME:
		// ignore metakeys (shift, ctrl, alt)
		break;
	default:
		// keypress is triggered before the input value is changed
		clearTimeout( self.searching );
		self.searching = setTimeout(function() {
			self.search( null, event );
		}, self.options.delay );
		break;
	}
})

And the modified code:

.bind("keydown.autocomplete", function(event) {
    var keyCode = $.ui.keyCode;
    switch (event.keyCode) {
        case keyCode.PAGE_UP:
            self._move("previousPage", event);
            break;
        case keyCode.PAGE_DOWN:
            self._move("nextPage", event);
            break;
        case keyCode.UP:
            self._move("previous", event);
            // prevent moving cursor to beginning of text field in some browsers
            event.preventDefault();
            break;
        case keyCode.DOWN:
            self._move("next", event);
            // prevent moving cursor to end of text field in some browsers
            event.preventDefault();
            break;
        case keyCode.ENTER:
        case keyCode.NUMPAD_ENTER:
            // when menu is open or has focus
            if (self.menu.active) {
                event.preventDefault();
            }
            //passthrough - ENTER and TAB both select the current element
        case keyCode.TAB:
            if (!self.menu.active) {
                return;
            }
            self.menu.select(event);
            break;
        case keyCode.ESCAPE:
            self.element.val(self.term);
            self.close(event);
            break;
        default:
            break;
    }
})
.bind("keyup.autocomplete", function(event) {
    var keyCode = $.ui.keyCode;
    switch (event.keyCode) {
        case keyCode.PAGE_UP:
        case keyCode.PAGE_DOWN:
        case keyCode.UP:
        case keyCode.DOWN:
        case keyCode.ENTER:
        case keyCode.NUMPAD_ENTER:
        case keyCode.TAB:
        case keyCode.ESCAPE:
        case keyCode.LEFT:
        case keyCode.RIGHT:
        case keyCode.SHIFT:
        case keyCode.CONTROL:
        case keyCode.ALT:
        case keyCode.COMMAND:
        case keyCode.COMMAND_RIGHT:
        case keyCode.INSERT:
        case keyCode.CAPS_LOCK:
        case keyCode.END:
        case keyCode.HOME:
            // ignore metakeys (shift, ctrl, alt)
            break;
        default:
            // keypress is triggered before the input value is changed
            clearTimeout(self.searching);
            self.searching = setTimeout(function() {
                self.search(null, event);
            }, self.options.delay);
            break;
    }
})

I have tried this and it really works. But I'm not sure if any new bug is introduced.

Changed August 26, 2010 01:48AM UTC by scottgonzalez comment:7

milestone: TBD1.9
priority: criticalmajor

Are you using a Chinese keyboard to test this? It's kind of difficult for us to land a fix to something that we can't test.

Changed August 26, 2010 03:25AM UTC by Zeke comment:8

Yes, I have used a Chinese keyboard to test this.

You can contact me and let's figure out how to configure a test environment. My MSN is lvzecai@hotmail.com

Changed August 26, 2010 03:30AM UTC by Zeke comment:9

Replying to [comment:8 Zeke]:

Yes, I have used a Chinese keyboard to test this. You can contact me and let's figure out how to configure a test environment. My MSN is lvzecai@hotmail.com

My MSN is lvzecai@ hotmail.com (Remove the blank space after @)

Changed September 27, 2010 12:21PM UTC by scottgonzalez comment:10

summary: when the user input chinese it's won't show the search result divAutocomplete: Ignores Chinese input

Changed September 30, 2010 01:35AM UTC by dleangen comment:11

I would suggest changing the title of this ticket to something like:

Autocomplete: improper use of key events when using an IME

Changed September 30, 2010 01:53AM UTC by dleangen comment:12

This is also a problem for me when using Japanese. I would like to try to provide help so we can fix this. Currently, the Autcomplete is useless for Japanese due to this problem.

You do not need a Chinese / Japanese keyboard to test: only an IME (input method editor). You can do this with a US keyboard.

In Japanese, you would enter a word like this (with the IME turned on). For example, the word "現行" (bank, pronounced "ginkou"):

press "g" (you see "g" in the text field, underlined, but not yet "entered")

press "i" (now you will see "ぎ", which is the "hiragana" [pronounciation] character for "gi")

press "n" (now you will see "ぎn" in the text field, still underlined, but not "entered")

press "n" (now you will see "ぎん" in the text field, still underlined, but not "entered")

press "k" (now you will see "ぎんk", ditto)

press "o" ("ぎんこ")

press "u" ("ぎんこう")

Finally, you now have all the text necessary to convert to the kanji (Chinese character).

press [space] (now you will see "銀行", which is the word we want, still underlinedbut not selected as there are other words that match the same pronounciation)

press [enter] (finally, the actual word is entered into the text field)

Here is one suggested behaviour for the above example. There are probably other ways, too, so let me know if this is too complicated to implement.

press "g" --> no action

press "i" --> lookup using "ぎ" as the lookup key

press "n" --> no additional action

press "n" --> lookup using "ぎん" as the lookup key

press "k" --> no additional action

press "o" --> lookup using "ぎんこ" as the lookup key

press "u" --> lookup using "ぎんこう" as the lookup key

press [space] --> no additional action

press [enter] --> lookup using "銀行" as the lookup key

Changed October 01, 2010 05:44PM UTC by scottgonzalez comment:13

description: the chinese user find if you input a chinese the autocomplete compment will not work only.current they using keyborad with down key to select the opinionthe chinese user find if you input a chinese the autocomplete compment will not work only.current they using keyborad with down key to select the opinion \ \ [http://forum.jquery.com/topic/any-plan-to-make-autocomplete-work-for-japanese-28-9-2010 forum post]
summary: Autocomplete: Ignores Chinese inputAutocomplete: Doesn't work with IME (input method editor)

Changed November 22, 2010 07:57PM UTC by scottgonzalez comment:14

resolution: → wontfix
status: reopenedclosed

Unfortunately, I think I have to close this ticket. I've spent a lot of time on this and I don't think this can work properly/consistently across browsers without polling and some crazy sophisticated translation tables.

Changed December 08, 2010 01:15PM UTC by scottgonzalez comment:15

#6730 is a duplicate of this ticket.

Changed March 28, 2011 01:19PM UTC by scottgonzalez comment:16

#7206 is a duplicate of this ticket.

Changed May 16, 2011 11:16AM UTC by scottgonzalez comment:17

#7375 is a duplicate of this ticket.

Changed October 06, 2011 07:40AM UTC by deerchao comment:18

_comment0: This issue only exists in FireFox. \ There is a easy fix: to bind event 'input' like this: \ \ {{{ \ bind('input.autocomplete',function (){ \ $(this).trigger('keydown'); \ }).bind('blur.autocomplete'... \ }}} \ 1317886825251377

This issue only exists in FireFox.

There is a easy fix: to bind event 'input' like this:

.bind('input.autocomplete',function (){
    $(this).trigger('keydown');
}).bind('blur.autocomplete'...

Changed October 06, 2011 12:15PM UTC by scottgonzalez comment:19

Replying to [comment:18 deerchao]:

This issue only exists in FireFox. There is a easy fix: to bind event 'input' like this:

The input event is actually not useful in Firefox with IME. It's exactly as useful/useless as keyup; it's only triggered when "committing" the word with enter.

Changed February 02, 2012 07:43AM UTC by NineAllexis comment:20

I just did some experiment and thought to share it with everyone.

keyup.autocomplete does not work for my Chinese Traditional IME.

It was then solved by adding input.autocomplete in the same line.

So it goes like...

.bind("keydown.autocomplet",function(event){....
.bind("keyup.autocomplete input.autocomplete", function(event) { ...

tested with Firefox 6, IE7, Chrome.

jQuery-ui-1.8.9