Skip to content

Commit c5ba053

Browse files
scottgonzalezscottgonzalez
committed
Autocomplete: Fixed setting of valueMethod for textareas. Fixes #7674 - Autocomplete doesn't work with textareas.
1 parent 87f7897 commit c5ba053

File tree

3 files changed

+71
-105
lines changed

3 files changed

+71
-105
lines changed

‎tests/unit/autocomplete/autocomplete.html

+1
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ <h2 id="qunit-userAgent"></h2>
3939
<div id="ac-wrap1" class="ac-wrap"></div>
4040
<div id="ac-wrap2" class="ac-wrap"><input id="autocomplete" class="foo"></div>
4141
<div id="autocomplete-contenteditable" contenteditable="" tabindex=0></div>
42+
<textarea id="autocomplete-textarea"></textarea>
4243

4344
</div>
4445
</body>

‎tests/unit/autocomplete/autocomplete_events.js

+69-104
Original file line numberDiff line numberDiff line change
@@ -4,110 +4,75 @@ module( "autocomplete: events" );
44

55
var data = [ "Clojure", "COBOL", "ColdFusion", "Java", "JavaScript", "Scala", "Scheme" ];
66

7-
asyncTest( "all events", function() {
8-
expect( 13 );
9-
var element = $( "#autocomplete" )
10-
.autocomplete({
11-
autoFocus: false,
12-
delay: 0,
13-
source: data,
14-
search: function( event ) {
15-
equal( event.originalEvent.type, "keydown", "search originalEvent" );
16-
},
17-
response: function( event, ui ) {
18-
deepEqual( ui.content, [
19-
{ label: "Clojure", value: "Clojure" },
20-
{ label: "Java", value: "Java" },
21-
{ label: "JavaScript", value: "JavaScript" }
22-
], "response ui.content" );
23-
ui.content.splice( 0, 1 );
24-
},
25-
open: function( event ) {
26-
ok( menu.is( ":visible" ), "menu open on open" );
27-
},
28-
focus: function( event, ui ) {
29-
equal( event.originalEvent.type, "menufocus", "focus originalEvent" );
30-
deepEqual( ui.item, { label: "Java", value: "Java" }, "focus ui.item" );
31-
},
32-
close: function( event ) {
33-
equal( event.originalEvent.type, "menuselect", "close originalEvent" );
34-
ok( menu.is( ":hidden" ), "menu closed on close" );
35-
},
36-
select: function( event, ui ) {
37-
equal( event.originalEvent.type, "menuselect", "select originalEvent" );
38-
deepEqual( ui.item, { label: "Java", value: "Java" }, "select ui.item" );
39-
},
40-
change: function( event, ui ) {
41-
equal( event.originalEvent.type, "blur", "change originalEvent" );
42-
deepEqual( ui.item, { label: "Java", value: "Java" }, "chnage ui.item" );
43-
ok( menu.is( ":hidden" ), "menu closed on change" );
44-
start();
45-
}
46-
}),
47-
menu = element.autocomplete( "widget" );
48-
49-
element.focus().val( "j" ).keydown();
50-
setTimeout(function() {
51-
ok( menu.is( ":visible" ), "menu is visible after delay" );
52-
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
53-
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
54-
// blurring through jQuery causes a bug in IE 6 which causes the
55-
// autocompletechange event to occur twice
56-
element[0].blur();
57-
}, 50 );
58-
});
59-
60-
asyncTest( "all events - contenteditable", function() {
61-
expect( 13 );
62-
var element = $( "#autocomplete-contenteditable" )
63-
.autocomplete({
64-
autoFocus: false,
65-
delay: 0,
66-
source: data,
67-
search: function( event ) {
68-
equal( event.originalEvent.type, "keydown", "search originalEvent" );
69-
},
70-
response: function( event, ui ) {
71-
deepEqual( ui.content, [
72-
{ label: "Clojure", value: "Clojure" },
73-
{ label: "Java", value: "Java" },
74-
{ label: "JavaScript", value: "JavaScript" }
75-
], "response ui.content" );
76-
ui.content.splice( 0, 1 );
77-
},
78-
open: function( event ) {
79-
ok( menu.is( ":visible" ), "menu open on open" );
80-
},
81-
focus: function( event, ui ) {
82-
equal( event.originalEvent.type, "menufocus", "focus originalEvent" );
83-
deepEqual( ui.item, { label: "Java", value: "Java" }, "focus ui.item" );
84-
},
85-
close: function( event ) {
86-
equal( event.originalEvent.type, "menuselect", "close originalEvent" );
87-
ok( menu.is( ":hidden" ), "menu closed on close" );
88-
},
89-
select: function( event, ui ) {
90-
equal( event.originalEvent.type, "menuselect", "select originalEvent" );
91-
deepEqual( ui.item, { label: "Java", value: "Java" }, "select ui.item" );
92-
},
93-
change: function( event, ui ) {
94-
equal( event.originalEvent.type, "blur", "change originalEvent" );
95-
deepEqual( ui.item, { label: "Java", value: "Java" }, "chnage ui.item" );
96-
ok( menu.is( ":hidden" ), "menu closed on change" );
97-
start();
98-
}
99-
}),
100-
menu = element.autocomplete( "widget" );
101-
102-
element.focus().text( "j" ).keydown();
103-
setTimeout(function() {
104-
ok( menu.is( ":visible" ), "menu is visible after delay" );
105-
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
106-
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
107-
// TODO: blurring through jQuery causes a bug in IE 6 which causes the
108-
// autocompletechange event to occur twice
109-
element[0].blur();
110-
}, 50 );
7+
$.each([
8+
{
9+
type: "input",
10+
selector: "#autocomplete",
11+
valueMethod: "val"
12+
},
13+
{
14+
type: "textarea",
15+
selector: "#autocomplete-textarea",
16+
valueMethod: "val"
17+
},
18+
{
19+
type: "contenteditable",
20+
selector: "#autocomplete-contenteditable",
21+
valueMethod: "text"
22+
}
23+
], function( i, settings ) {
24+
asyncTest( "all events - " + settings.type, function() {
25+
expect( 13 );
26+
var element = $( settings.selector )
27+
.autocomplete({
28+
autoFocus: false,
29+
delay: 0,
30+
source: data,
31+
search: function( event ) {
32+
equal( event.originalEvent.type, "keydown", "search originalEvent" );
33+
},
34+
response: function( event, ui ) {
35+
deepEqual( ui.content, [
36+
{ label: "Clojure", value: "Clojure" },
37+
{ label: "Java", value: "Java" },
38+
{ label: "JavaScript", value: "JavaScript" }
39+
], "response ui.content" );
40+
ui.content.splice( 0, 1 );
41+
},
42+
open: function( event ) {
43+
ok( menu.is( ":visible" ), "menu open on open" );
44+
},
45+
focus: function( event, ui ) {
46+
equal( event.originalEvent.type, "menufocus", "focus originalEvent" );
47+
deepEqual( ui.item, { label: "Java", value: "Java" }, "focus ui.item" );
48+
},
49+
close: function( event ) {
50+
equal( event.originalEvent.type, "menuselect", "close originalEvent" );
51+
ok( menu.is( ":hidden" ), "menu closed on close" );
52+
},
53+
select: function( event, ui ) {
54+
equal( event.originalEvent.type, "menuselect", "select originalEvent" );
55+
deepEqual( ui.item, { label: "Java", value: "Java" }, "select ui.item" );
56+
},
57+
change: function( event, ui ) {
58+
equal( event.originalEvent.type, "blur", "change originalEvent" );
59+
deepEqual( ui.item, { label: "Java", value: "Java" }, "chnage ui.item" );
60+
ok( menu.is( ":hidden" ), "menu closed on change" );
61+
start();
62+
}
63+
}),
64+
menu = element.autocomplete( "widget" );
65+
66+
element.focus()[ settings.valueMethod ]( "j" ).keydown();
67+
setTimeout(function() {
68+
ok( menu.is( ":visible" ), "menu is visible after delay" );
69+
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
70+
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
71+
// blurring through jQuery causes a bug in IE 6 which causes the
72+
// autocompletechange event to occur twice
73+
element[0].blur();
74+
}, 50 );
75+
});
11176
});
11277

11378
asyncTest( "change without selection", function() {

‎ui/jquery.ui.autocomplete.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ $.widget( "ui.autocomplete", {
5151
suppressKeyPress,
5252
suppressInput;
5353

54-
this.valueMethod = this.element[ this.element.is( "input" ) ? "val" : "text" ];
54+
this.valueMethod = this.element[ this.element.is( "input,textarea" ) ? "val" : "text" ];
5555

5656
this.element
5757
.addClass( "ui-autocomplete-input" )

0 commit comments

Comments
 (0)