Skip to content
Permalink
Browse files
Autocomplete: Don't invoke a search from arrow keys when the element …
…can have multi-line text. Fixes #7639 - Key up/key down in textarea's should optionally not toggle auto-complete.
  • Loading branch information
meh-cfl authored and scottgonzalez committed Apr 7, 2012
1 parent d040b8f commit 9668cb850ef97e39822cb3ef0d0ea27ff0c1fe6e
Showing with 75 additions and 6 deletions.
  1. +1 −0 tests/unit/autocomplete/autocomplete.html
  2. +63 −0 tests/unit/autocomplete/autocomplete_core.js
  3. +11 −6 ui/jquery.ui.autocomplete.js
@@ -38,6 +38,7 @@ <h2 id="qunit-userAgent"></h2>

<div id="ac-wrap1" class="ac-wrap"></div>
<div id="ac-wrap2" class="ac-wrap"><input id="autocomplete" class="foo" /></div>
<textarea id="autocomplete-textarea"></textarea>
</div>

</body>
@@ -97,5 +97,68 @@ asyncTest( "handle race condition", function() {
start();
}
});
test( "up arrow invokes search - input", function() {
arrowsInvokeSearch( "#autocomplete", true, true );
});

test( "down arrow invokes search - input", function() {
arrowsInvokeSearch( "#autocomplete", false, true );
});

test( "up arrow invokes search - textarea", function() {
arrowsInvokeSearch( "#autocomplete-textarea", true, false );
});

test( "down arrow invokes search - textarea", function() {
arrowsInvokeSearch( "#autocomplete-textarea", false, false );
});

test( "up arrow moves focus - input", function() {
arrowsMoveFocus( "#autocomplete", true );
});

test( "down arrow moves focus - input", function() {
arrowsMoveFocus( "#autocomplete", false );
});

test( "up arrow moves focus - textarea", function() {
arrowsMoveFocus( "#autocomplete-textarea", true );
});

test( "down arrow moves focus - textarea", function() {
arrowsMoveFocus( "#autocomplete-textarea", false );
});

function arrowsInvokeSearch( id, isKeyUp, shouldMove ) {
expect( 1 );

var didMove = false,
element = $( id ).autocomplete({
source: [ "a" ],
delay: 0,
minLength: 0
});
element.data( "autocomplete" )._move = function() {
didMove = true;
};
element.simulate( "keydown", { keyCode: ( isKeyUp ? $.ui.keyCode.UP : $.ui.keyCode.DOWN ) } );
equal( didMove, shouldMove, "respond to arrow" );
}

function arrowsMoveFocus( id, isKeyUp ) {
expect( 1 );

var didMove = false,
element = $( id ).autocomplete({
source: [ "a" ],
delay: 0,
minLength: 0
});
element.data( "autocomplete" )._move = function() {
ok( true, "repsond to arrow" );
};
element.autocomplete( "search" );
element.simulate( "keydown", { keyCode: ( isKeyUp ? $.ui.keyCode.UP : $.ui.keyCode.DOWN ) } );
}

}( jQuery ) );
@@ -37,6 +37,7 @@ $.widget( "ui.autocomplete", {
var self = this,
doc = this.element[ 0 ].ownerDocument,
suppressKeyPress;
this.isMultiLine = this.element.is( "textarea" );

this.element
.addClass( "ui-autocomplete-input" )
@@ -62,14 +63,10 @@ $.widget( "ui.autocomplete", {
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();
self._keyEvent( "previous", event );
break;
case keyCode.DOWN:
self._move( "next", event );
// prevent moving cursor to end of text field in some browsers
event.preventDefault();
self._keyEvent( "next", event );
break;
case keyCode.ENTER:
case keyCode.NUMPAD_ENTER:
@@ -424,6 +421,14 @@ $.widget( "ui.autocomplete", {

widget: function() {
return this.menu.element;
},
_keyEvent: function( keyEvent, event ) {
if ( !this.isMultiLine || this.menu.element.is( ":visible" ) ) {
this._move( keyEvent, event );

// prevents moving cursor to beginning/end of the text field in some browsers
event.preventDefault();
}
}
});

0 comments on commit 9668cb8

Please sign in to comment.