boolean |
animHoriz
Whether or not to animate the expansion/collapse of the auto complete
container in the horizontal direction.
|
number |
animSpeed
Speed of container expand/collapse animation, in seconds.
|
boolean |
animVert
Whether or not to animate the expansion/collapse of the auto complete
container in the vertical direction.
|
Object |
containerCollapseEvent
Fired when the auto complete container is collapsed.
|
Object |
containerExpandEvent
Fired when the auto complete container is expanded.
|
Object |
dataErrorEvent
Fired when the auto complete instance does not receive query results from the
data source due to an error.
|
Object |
dataRequestEvent
Fired when the auto complete instance makes a query to the data source.
|
Object |
dataReturnEvent
Fired when the auto complete instance receives query results from the data
source.
|
object |
dataSource
The data source object that encapsulates the data used for auto completion.
|
string or array |
delimChar
Query delimiter.
|
boolean |
forceSelection
Whether or not to force the user's selection to match one of the query
results.
|
string |
highlightClassName
Class name of a highlighted item within the auto complete container.
|
Object |
itemArrowFromEvent
Fired when result item has been arrowed away from.
|
Object |
itemArrowToEvent
Fired when result item has been arrowed to.
|
Object |
itemMouseOutEvent
Fired when result item has been moused out.
|
Object |
itemMouseOverEvent
Fired when result item has been moused over.
|
Object |
itemSelectEvent
Fired when an item is selected via mouse click, ENTER key, or TAB key.
|
number |
maxResultsDisplayed
Maximum number of results to display in auto complete container.
|
number |
minQueryLength
Number of characters that must be entered before querying for results.
|
number |
queryDelay
Number of seconds to delay before submitting a query request.
|
Object |
selectionEnforceEvent
Fired if forceSelection is enabled and the user's input has been cleared
because it did not match one of the returned query results.
|
Object |
textboxBlurEvent
Fired when the auto complete text input box loses focus.
|
Object |
textboxFocusEvent
Fired when the auto complete text input box receives focus.
|
Object |
textboxKeyEvent
Fired when the auto complete text input box receives key input.
|
boolean |
typeAhead
Whether or not the auto complete input field should be automatically updated
with the first query result as the user types, auto-selecting the substring
that the user has not typed.
|
Object |
typeAheadEvent
Fired when the auto complete textbox has been prefilled by the type-ahead
feature.
|
boolean |
useIFrame
Whether or not to use an iFrame to layer over Windows form elements in
IE.
|
Class YAHOO.widget.AutoComplete
Object | +--YAHOO.widget.AutoComplete
class
YAHOO.widget.AutoComplete
Field Summary [top]
Constructor Summary [top]
YAHOO.widget.AutoComplete
Class providing the customizable functionality of a plug-and-play DHTML
auto complete widget.
Method Summary [top]
string |
formatResult
(<object> oResultItem, <string> sQuery)
Overridable method that converts a result item object into HTML markup
for display.
|
array |
getListIds
()
Public accessor to the internal array of DOM <li> element IDs that
display query results within the auto complete container.
|
string |
getName
()
Public accessor to the unique name of the auto complete instance.
|
void |
setFooter
(<string> sFooter)
Sets HTML markup for the auto complete container footer.
|
void |
setHeader
(<string> sHeader)
Sets HTML markup for the auto complete container header.
|
Field Detail [top]
animHoriz
boolean
animHoriz
Whether or not to animate the expansion/collapse of the auto complete
container in the horizontal direction. Default: false.
animSpeed
number
animSpeed
Speed of container expand/collapse animation, in seconds. Default: 0.3.
animVert
boolean
animVert
Whether or not to animate the expansion/collapse of the auto complete
container in the vertical direction. Default: true.
containerCollapseEvent
Object
containerCollapseEvent
Fired when the auto complete container is collapsed. Subscribers receive the
following array:
- args[0] The auto complete object instance
- args[0] The auto complete object instance
containerExpandEvent
Object
containerExpandEvent
Fired when the auto complete container is expanded. Subscribers receive the
following array:
- args[0] The auto complete object instance
- args[0] The auto complete object instance
dataErrorEvent
Object
dataErrorEvent
Fired when the auto complete instance does not receive query results from the
data source due to an error. Subscribers receive the following array:
- args[0] The auto complete object instance - args[1] The query string
- args[0] The auto complete object instance - args[1] The query string
dataRequestEvent
Object
dataRequestEvent
Fired when the auto complete instance makes a query to the data source.
Subscribers receive the following array:
- args[0] The auto complete object instance - args[1] The query string
- args[0] The auto complete object instance - args[1] The query string
dataReturnEvent
Object
dataReturnEvent
Fired when the auto complete instance receives query results from the data
source. Subscribers receive the following array:
- args[0] The auto complete object instance - args[1] The query string - args[2] Results array
- args[0] The auto complete object instance - args[1] The query string - args[2] Results array
dataSource
object
dataSource
The data source object that encapsulates the data used for auto completion.
This object should be an inherited object from YAHOO.widget.DataSource.
delimChar
string or array
delimChar
Query delimiter. A single character separator for multiple delimited
selections. Multiple delimiter characteres may be defined as an array of
strings. A null value or empty string indicates that query results cannot
be delimited. This feature is not recommended if you need forceSelection to
be true. Default: null.
forceSelection
boolean
forceSelection
Whether or not to force the user's selection to match one of the query
results. Enabling this feature essentially transforms the auto complete form
input field into a <select> field. This feature is not recommended
with delimiter character(s) defined. Default: false.
highlightClassName
string
highlightClassName
Class name of a highlighted item within the auto complete container.
Default: "highlight".
itemArrowFromEvent
Object
itemArrowFromEvent
Fired when result item has been arrowed away from. Subscribers receive the
following array:
- args[0] The auto complete object instance - args[1] The <li> element item arrowed from
- args[0] The auto complete object instance - args[1] The <li> element item arrowed from
itemArrowToEvent
Object
itemArrowToEvent
Fired when result item has been arrowed to. Subscribers receive the following
array:
- args[0] The auto complete object instance - args[1] The <li> element item arrowed to
- args[0] The auto complete object instance - args[1] The <li> element item arrowed to
itemMouseOutEvent
Object
itemMouseOutEvent
Fired when result item has been moused out. Subscribers receive the
following array:
- args[0] The auto complete object instance - args[1] The <li> element item moused from
- args[0] The auto complete object instance - args[1] The <li> element item moused from
itemMouseOverEvent
Object
itemMouseOverEvent
Fired when result item has been moused over. Subscribers receive the following
array:
- args[0] The auto complete object instance - args[1] The <li> element item moused to
- args[0] The auto complete object instance - args[1] The <li> element item moused to
itemSelectEvent
Object
itemSelectEvent
Fired when an item is selected via mouse click, ENTER key, or TAB key.
Subscribers receive the following array:
- args[0] The auto complete object instance - args[1] The selected <li> element item
- args[0] The auto complete object instance - args[1] The selected <li> element item
maxResultsDisplayed
number
maxResultsDisplayed
Maximum number of results to display in auto complete container. Default: 10.
minQueryLength
number
minQueryLength
Number of characters that must be entered before querying for results.
Default: 1.
queryDelay
number
queryDelay
Number of seconds to delay before submitting a query request. If a query
request is received before a previous one has completed its delay, the
previous request is cancelled and the new request is set to the delay.
Default: 0.5.
selectionEnforceEvent
Object
selectionEnforceEvent
Fired if forceSelection is enabled and the user's input has been cleared
because it did not match one of the returned query results. Subscribers
receive the following array:
- args[0] The auto complete object instance
- args[0] The auto complete object instance
textboxBlurEvent
Object
textboxBlurEvent
Fired when the auto complete text input box loses focus. Subscribers receive
an array of the following array:
- args[0] The auto complete object instance
- args[0] The auto complete object instance
textboxFocusEvent
Object
textboxFocusEvent
Fired when the auto complete text input box receives focus. Subscribers
receive the following array:
- args[0] The auto complete object instance
- args[0] The auto complete object instance
textboxKeyEvent
Object
textboxKeyEvent
Fired when the auto complete text input box receives key input. Subscribers
receive the following array:
- args[0] The auto complete object instance - args[1] The keycode number
- args[0] The auto complete object instance - args[1] The keycode number
typeAhead
boolean
typeAhead
Whether or not the auto complete input field should be automatically updated
with the first query result as the user types, auto-selecting the substring
that the user has not typed. Default: false.
typeAheadEvent
Object
typeAheadEvent
Fired when the auto complete textbox has been prefilled by the type-ahead
feature. Subscribers receive the following array:
- args[0] The auto complete object instance - args[1] The query string - args[2] The prefill string
- args[0] The auto complete object instance - args[1] The query string - args[2] The prefill string
useIFrame
boolean
useIFrame
Whether or not to use an iFrame to layer over Windows form elements in
IE. Set to true only when the auto complete container will be on top of a
<select> field in IE and thus exposed to the IE z-index bug (i.e.,
5.5 < IE < 7). Default:false.
Constructor Detail [top]
YAHOO.widget.AutoComplete
YAHOO.widget.AutoComplete
()
Class providing the customizable functionality of a plug-and-play DHTML
auto complete widget. Some key features:
- Navigate with up/down arrow keys and/or mouse to pick a selection
- The drop down container can "roll down" or "fly out" via configurable animation
- UI look-and-feel customizable through CSS, including container attributes, borders, position, fonts, etc
- Parameters:
-
inputEl
- DOM element reference or string ID of the auto complete input field -
containerEl
- DOM element reference or string ID of the auto complete <div> container -
oDataSource
- Instance of YAHOO.widget.DataSource for query/results -
oConfigs
- Optional object literal of config params
Method Detail [top]
formatResult
string
formatResult
(<object> oResultItem, <string> sQuery)
Overridable method that converts a result item object into HTML markup
for display. Return data values are accessible via the oResultItem object,
and the key return value will always be oResultItem[0]. Markup will be
displayed within <li> element tags in the container.
- Parameters:
-
oResultItem
- Result item object representing one query result -
sQuery
- The current query string
- Returns:
- HTML markup of formatted result data
getListIds
array
getListIds
()
Public accessor to the internal array of DOM <li> element IDs that
display query results within the auto complete container.
- Returns:
- Array of <li> element IDs within the auto complete container
getName
string
getName
()
Public accessor to the unique name of the auto complete instance.
- Returns:
- Unique name of the auto complete instance
setFooter
void
setFooter
(<string> sFooter)
Sets HTML markup for the auto complete container footer. This markup will be
inserted within a <div> tag with a class of "ac_ft".
- Parameters:
-
sFooter
- HTML markup for container footer
setHeader
void
setHeader
(<string> sHeader)
Sets HTML markup for the auto complete container header. This markup will be
inserted within a <div> tag with a class of "ac_hd".
- Parameters:
-
sHeader
- HTML markup for container header