@@ -46,17 +46,14 @@ $.widget( "ui.autocomplete", {
46
46
pending : 0 ,
47
47
48
48
_create : function ( ) {
49
- var self = this ,
50
- // Some browsers only repeat keydown events, not keypress events,
51
- // so we use the suppressKeyPress flag to determine if we've already
52
- // handled the keydown event. #7269
53
- // Unfortunately the code for & in keypress is the same as the up arrow,
54
- // so we use the suppressKeyPressRepeat flag to avoid handling keypress
55
- // events when we know the keydown event was used to modify the
56
- // search term. #7799
57
- suppressKeyPress ,
58
- suppressKeyPressRepeat ,
59
- suppressInput ;
49
+ // Some browsers only repeat keydown events, not keypress events,
50
+ // so we use the suppressKeyPress flag to determine if we've already
51
+ // handled the keydown event. #7269
52
+ // Unfortunately the code for & in keypress is the same as the up arrow,
53
+ // so we use the suppressKeyPressRepeat flag to avoid handling keypress
54
+ // events when we know the keydown event was used to modify the
55
+ // search term. #7799
56
+ var suppressKeyPress , suppressKeyPressRepeat , suppressInput ;
60
57
61
58
this . isMultiLine = this . element . is ( "textarea,[contenteditable]" ) ;
62
59
this . valueMethod = this . element [ this . element . is ( "input,textarea" ) ? "val" : "text" ] ;
@@ -69,9 +66,11 @@ $.widget( "ui.autocomplete", {
69
66
role : "textbox" ,
70
67
"aria-autocomplete" : "list" ,
71
68
"aria-haspopup" : "true"
72
- } )
73
- . bind ( "keydown.autocomplete" , function ( event ) {
74
- if ( self . options . disabled || self . element . prop ( "readOnly" ) ) {
69
+ } ) ;
70
+
71
+ this . _bind ( {
72
+ keydown : function ( event ) {
73
+ if ( this . element . prop ( "readOnly" ) ) {
75
74
suppressKeyPress = true ;
76
75
suppressInput = true ;
77
76
suppressKeyPressRepeat = true ;
@@ -85,40 +84,40 @@ $.widget( "ui.autocomplete", {
85
84
switch ( event . keyCode ) {
86
85
case keyCode . PAGE_UP :
87
86
suppressKeyPress = true ;
88
- self . _move ( "previousPage" , event ) ;
87
+ this . _move ( "previousPage" , event ) ;
89
88
break ;
90
89
case keyCode . PAGE_DOWN :
91
90
suppressKeyPress = true ;
92
- self . _move ( "nextPage" , event ) ;
91
+ this . _move ( "nextPage" , event ) ;
93
92
break ;
94
93
case keyCode . UP :
95
94
suppressKeyPress = true ;
96
- self . _keyEvent ( "previous" , event ) ;
95
+ this . _keyEvent ( "previous" , event ) ;
97
96
break ;
98
97
case keyCode . DOWN :
99
98
suppressKeyPress = true ;
100
- self . _keyEvent ( "next" , event ) ;
99
+ this . _keyEvent ( "next" , event ) ;
101
100
break ;
102
101
case keyCode . ENTER :
103
102
case keyCode . NUMPAD_ENTER :
104
103
// when menu is open and has focus
105
- if ( self . menu . active ) {
104
+ if ( this . menu . active ) {
106
105
// #6055 - Opera still allows the keypress to occur
107
106
// which causes forms to submit
108
107
suppressKeyPress = true ;
109
108
event . preventDefault ( ) ;
110
- self . menu . select ( event ) ;
109
+ this . menu . select ( event ) ;
111
110
}
112
111
break ;
113
112
case keyCode . TAB :
114
- if ( self . menu . active ) {
115
- self . menu . select ( event ) ;
113
+ if ( this . menu . active ) {
114
+ this . menu . select ( event ) ;
116
115
}
117
116
break ;
118
117
case keyCode . ESCAPE :
119
- if ( self . menu . element . is ( ":visible" ) ) {
120
- self . _value ( self . term ) ;
121
- self . close ( event ) ;
118
+ if ( this . menu . element . is ( ":visible" ) ) {
119
+ this . _value ( this . term ) ;
120
+ this . close ( event ) ;
122
121
// Different browsers have different default behavior for escape
123
122
// Single press can mean undo or clear
124
123
// Double press in IE means clear the whole form
@@ -128,11 +127,11 @@ $.widget( "ui.autocomplete", {
128
127
default :
129
128
suppressKeyPressRepeat = true ;
130
129
// search timeout should be triggered before the input value is changed
131
- self . _searchTimeout ( event ) ;
130
+ this . _searchTimeout ( event ) ;
132
131
break ;
133
132
}
134
- } )
135
- . bind ( " keypress.autocomplete" , function ( event ) {
133
+ } ,
134
+ keypress : function ( event ) {
136
135
if ( suppressKeyPress ) {
137
136
suppressKeyPress = false ;
138
137
event . preventDefault ( ) ;
@@ -146,129 +145,125 @@ $.widget( "ui.autocomplete", {
146
145
var keyCode = $ . ui . keyCode ;
147
146
switch ( event . keyCode ) {
148
147
case keyCode . PAGE_UP :
149
- self . _move ( "previousPage" , event ) ;
148
+ this . _move ( "previousPage" , event ) ;
150
149
break ;
151
150
case keyCode . PAGE_DOWN :
152
- self . _move ( "nextPage" , event ) ;
151
+ this . _move ( "nextPage" , event ) ;
153
152
break ;
154
153
case keyCode . UP :
155
- self . _keyEvent ( "previous" , event ) ;
154
+ this . _keyEvent ( "previous" , event ) ;
156
155
break ;
157
156
case keyCode . DOWN :
158
- self . _keyEvent ( "next" , event ) ;
157
+ this . _keyEvent ( "next" , event ) ;
159
158
break ;
160
159
}
161
- } )
162
- . bind ( " input.autocomplete" , function ( event ) {
160
+ } ,
161
+ input : function ( event ) {
163
162
if ( suppressInput ) {
164
163
suppressInput = false ;
165
164
event . preventDefault ( ) ;
166
165
return ;
167
166
}
168
- self . _searchTimeout ( event ) ;
169
- } )
170
- . bind ( "focus.autocomplete" , function ( ) {
171
- if ( self . options . disabled ) {
167
+ this . _searchTimeout ( event ) ;
168
+ } ,
169
+ focus : function ( ) {
170
+ this . selectedItem = null ;
171
+ this . previous = this . _value ( ) ;
172
+ } ,
173
+ blur : function ( event ) {
174
+ if ( this . cancelBlur ) {
175
+ delete this . cancelBlur ;
172
176
return ;
173
177
}
174
178
175
- self . selectedItem = null ;
176
- self . previous = self . _value ( ) ;
177
- } )
178
- . bind ( "blur.autocomplete" , function ( event ) {
179
- if ( self . options . disabled ) {
180
- return ;
181
- }
182
-
183
- if ( self . cancelBlur ) {
184
- delete self . cancelBlur ;
185
- return ;
186
- }
179
+ clearTimeout ( this . searching ) ;
180
+ this . close ( event ) ;
181
+ this . _change ( event ) ;
182
+ }
183
+ } ) ;
187
184
188
- clearTimeout ( self . searching ) ;
189
- self . close ( event ) ;
190
- self . _change ( event ) ;
191
- } ) ;
192
185
this . _initSource ( ) ;
193
186
this . menu = $ ( "<ul></ul>" )
194
187
. addClass ( "ui-autocomplete" )
195
188
. appendTo ( this . document . find ( this . options . appendTo || "body" ) [ 0 ] )
196
- // prevent the close-on-blur in case of a "slow" click on the menu (long mousedown)
197
- . mousedown ( function ( event ) {
189
+ . menu ( {
190
+ // custom key handling for now
191
+ input : $ ( )
192
+ } )
193
+ . zIndex ( this . element . zIndex ( ) + 1 )
194
+ . hide ( )
195
+ . data ( "menu" ) ;
196
+ this . _bind ( this . menu . element , {
197
+ mousedown : function ( event ) {
198
198
// prevent moving focus out of the text field
199
199
event . preventDefault ( ) ;
200
200
201
201
// IE doesn't prevent moving focus even with event.preventDefault()
202
202
// so we set a flag to know when we should ignore the blur event
203
- self . cancelBlur = true ;
204
- setTimeout ( function ( ) {
205
- delete self . cancelBlur ;
206
- } , 1 ) ;
203
+ this . cancelBlur = true ;
204
+ this . _delay ( function ( ) {
205
+ delete this . cancelBlur ;
206
+ } ) ;
207
207
208
208
// clicking on the scrollbar causes focus to shift to the body
209
209
// but we can't detect a mouseup or a click immediately afterward
210
210
// so we have to track the next mousedown and close the menu if
211
211
// the user clicks somewhere outside of the autocomplete
212
- var menuElement = self . menu . element [ 0 ] ;
212
+ var menuElement = this . menu . element [ 0 ] ;
213
213
if ( ! $ ( event . target ) . closest ( ".ui-menu-item" ) . length ) {
214
- setTimeout ( function ( ) {
215
- self . document . one ( 'mousedown' , function ( event ) {
216
- if ( event . target !== self . element [ 0 ] &&
217
- event . target !== menuElement &&
218
- ! $ . contains ( menuElement , event . target ) ) {
219
- self . close ( ) ;
214
+ this . _delay ( function ( ) {
215
+ var that = this ;
216
+ this . document . one ( 'mousedown' , function ( event ) {
217
+ if ( event . target !== that . element [ 0 ] &&
218
+ event . target !== menuElement &&
219
+ ! $ . contains ( menuElement , event . target ) ) {
220
+ that . close ( ) ;
220
221
}
221
222
} ) ;
222
- } , 1 ) ;
223
+ } ) ;
223
224
}
224
- } )
225
- . menu ( {
226
- // custom key handling for now
227
- input : $ ( ) ,
228
- focus : function ( event , ui ) {
229
- // back compat for _renderItem using item.autocomplete, via #7810
230
- // TODO remove the fallback, see #8156
231
- var item = ui . item . data ( "ui-autocomplete-item" ) || ui . item . data ( "item.autocomplete" ) ;
232
- if ( false !== self . _trigger ( "focus" , event , { item : item } ) ) {
233
- // use value to match what will end up in the input, if it was a key event
234
- if ( / ^ k e y / . test ( event . originalEvent . type ) ) {
235
- self . _value ( item . value ) ;
236
- }
225
+ } ,
226
+ menufocus : function ( event , ui ) {
227
+ // back compat for _renderItem using item.autocomplete, via #7810
228
+ // TODO remove the fallback, see #8156
229
+ var item = ui . item . data ( "ui-autocomplete-item" ) || ui . item . data ( "item.autocomplete" ) ;
230
+ if ( false !== this . _trigger ( "focus" , event , { item : item } ) ) {
231
+ // use value to match what will end up in the input, if it was a key event
232
+ if ( / ^ k e y / . test ( event . originalEvent . type ) ) {
233
+ this . _value ( item . value ) ;
237
234
}
238
- } ,
239
- select : function ( event , ui ) {
240
- // back compat for _renderItem using item.autocomplete, via #7810
241
- // TODO remove the fallback, see #8156
242
- var item = ui . item . data ( "ui-autocomplete-item" ) || ui . item . data ( "item.autocomplete" ) ,
243
- previous = self . previous ;
244
-
245
- // only trigger when focus was lost (click on menu)
246
- if ( self . element [ 0 ] !== self . document [ 0 ] . activeElement ) {
247
- self . element . focus ( ) ;
248
- self . previous = previous ;
249
- // #6109 - IE triggers two focus events and the second
250
- // is asynchronous, so we need to reset the previous
251
- // term synchronously and asynchronously :-(
252
- setTimeout ( function ( ) {
253
- self . previous = previous ;
254
- self . selectedItem = item ;
255
- } , 1 ) ;
256
- }
257
-
258
- if ( false !== self . _trigger ( "select" , event , { item : item } ) ) {
259
- self . _value ( item . value ) ;
260
- }
261
- // reset the term after the select event
262
- // this allows custom select handling to work properly
263
- self . term = self . _value ( ) ;
235
+ }
236
+ } ,
237
+ menuselect : function ( event , ui ) {
238
+ // back compat for _renderItem using item.autocomplete, via #7810
239
+ // TODO remove the fallback, see #8156
240
+ var item = ui . item . data ( "ui-autocomplete-item" ) || ui . item . data ( "item.autocomplete" ) ,
241
+ previous = this . previous ;
242
+
243
+ // only trigger when focus was lost (click on menu)
244
+ if ( this . element [ 0 ] !== this . document [ 0 ] . activeElement ) {
245
+ this . element . focus ( ) ;
246
+ this . previous = previous ;
247
+ // #6109 - IE triggers two focus events and the second
248
+ // is asynchronous, so we need to reset the previous
249
+ // term synchronously and asynchronously :-(
250
+ setTimeout ( function ( ) {
251
+ this . previous = previous ;
252
+ this . selectedItem = item ;
253
+ } , 1 ) ;
254
+ }
264
255
265
- self . close ( event ) ;
266
- self . selectedItem = item ;
256
+ if ( false !== this . _trigger ( "select" , event , { item : item } ) ) {
257
+ this . _value ( item . value ) ;
267
258
}
268
- } )
269
- . zIndex ( this . element . zIndex ( ) + 1 )
270
- . hide ( )
271
- . data ( "menu" ) ;
259
+ // reset the term after the select event
260
+ // this allows custom select handling to work properly
261
+ this . term = this . _value ( ) ;
262
+
263
+ this . close ( event ) ;
264
+ this . selectedItem = item ;
265
+ }
266
+ } ) ;
272
267
273
268
if ( $ . fn . bgiframe ) {
274
269
this . menu . element . bgiframe ( ) ;
@@ -309,7 +304,7 @@ $.widget( "ui.autocomplete", {
309
304
} ,
310
305
311
306
_initSource : function ( ) {
312
- var self = this ,
307
+ var that = this ,
313
308
array ,
314
309
url ;
315
310
if ( $ . isArray ( this . options . source ) ) {
@@ -320,10 +315,10 @@ $.widget( "ui.autocomplete", {
320
315
} else if ( typeof this . options . source === "string" ) {
321
316
url = this . options . source ;
322
317
this . source = function ( request , response ) {
323
- if ( self . xhr ) {
324
- self . xhr . abort ( ) ;
318
+ if ( that . xhr ) {
319
+ that . xhr . abort ( ) ;
325
320
}
326
- self . xhr = $ . ajax ( {
321
+ that . xhr = $ . ajax ( {
327
322
url : url ,
328
323
data : request ,
329
324
dataType : "json" ,
@@ -341,15 +336,14 @@ $.widget( "ui.autocomplete", {
341
336
} ,
342
337
343
338
_searchTimeout : function ( event ) {
344
- var self = this ;
345
- clearTimeout ( self . searching ) ;
346
- self . searching = setTimeout ( function ( ) {
339
+ clearTimeout ( this . searching ) ;
340
+ this . searching = this . _delay ( function ( ) {
347
341
// only search if the value has changed
348
- if ( self . term !== self . _value ( ) ) {
349
- self . selectedItem = null ;
350
- self . search ( null , event ) ;
342
+ if ( this . term !== this . _value ( ) ) {
343
+ this . selectedItem = null ;
344
+ this . search ( null , event ) ;
351
345
}
352
- } , self . options . delay ) ;
346
+ } , this . options . delay ) ;
353
347
} ,
354
348
355
349
search : function ( value , event ) {
@@ -478,9 +472,9 @@ $.widget( "ui.autocomplete", {
478
472
} ,
479
473
480
474
_renderMenu : function ( ul , items ) {
481
- var self = this ;
475
+ var that = this ;
482
476
$ . each ( items , function ( index , item ) {
483
- self . _renderItemData ( ul , item ) ;
477
+ that . _renderItemData ( ul , item ) ;
484
478
} ) ;
485
479
} ,
486
480
0 commit comments