Module: TypeAHead

Classes

TypeAHead

Members

_classList :Array.<string>

Array of CSS classes to apply to the main text input.

Type:
  • Array.<string>
Source:

_currentDescription :string

Current value of the main text input.

Type:
  • string
Source:

_currentSearchTerm :string

Current value of the main text input while user is typing.

Type:
  • string
Source:

_displayItems :number

Max number of elements to display. _options object will be sliced until this index. This option is used to prevent adding a large amount of nodes to the DOM.

Type:
  • number
Source:

_mainTemplate :function

Main template HTML structure

Type:
  • function
Source:

_moreItems :boolean

True if options are sliced, false otherwise Useful for warning the user that the search term has produced a high number of results and that if they want to view all of them they need to refine the search

Type:
  • boolean
Source:

_onSearch :boolean

User is typing or not

Type:
  • boolean
Source:

_options :Array.<object>

List of possible key-value options filtered by text search. The component is designed to display only the available options and manage their selection by the user. Any updated list of options must be set by the parent component/element using the appropriate option setter.

The objects in this property must contain at least two mandatory properties:

  • an id property, which represents the key of the option
  • a description property, which represents the value of the option
Type:
  • Array.<object>
Source:

_timeoutDelay :number

Delay time in milliseconds to aply to the _timeoutFunction function.

Type:
  • number
Source:

_timeoutFunction :function

Typing delay management function.

Type:
  • function
Source:

hiddenInput :Element|null

Returns hidden input HTML node

Type:
  • Element | null
Source:

options :Array.<object>

returns the _options internal property

Type:
  • Array.<object>
Source:

options

Update the options list

Source:

optionsContainer :Element|null

Returns options result container HTML node

Type:
  • Element | null
Source:

typeInput :Element|null

Returns text input HTML node

Type:
  • Element | null
Source:

value :string

Current true input value

Type:
  • string
Source:

Methods

_getOptionsContainerTopPosition() → {number}

Get the options container top position.

If the main text input is placed in the first half of the screen (from top) then show the panel beneath the main text input. Else position the panel above it.

Source:
Returns:
Type
number

_getValueDescription() → {string}

Get the option description based on the option key.

Source:
Returns:
Type
string

_handleBlur(e) → {void}

Determines the component's behavior in response to the main text input's blur event. It manages the option's key-value mapping. If a valid option is selected from those in the options property, the main text input is filled with the option's description (value), while the hidden input field is filled with the option's actual value (key). Otherwhise, rolls back the state of the components to the previous valid selected option. (an empty option is a valid selected option)

Parameters:
Name Type Description
e Event

blur event
Source:
Fires:
  • TypeAHead#event:lizmap-typeahead-change
Returns:
Type
void

_handleKeyUp(e) → {void}

Determines the component's behavior in response to the main text input's keyup event. To reduce the number of lizmap-typeahead-search events fired, a timeout function has been applied.

Parameters:
Name Type Description
e Event

keyup event
Source:
Fires:
  • TypeAHead#event:lizmap-typeahead-search
Returns:
Type
void

_preventMuoseUpEvent(e) → {void}

Avoid unwanted side effetct derived from the mouseup event on options container when container is removed after clicking an option.

Parameters:
Name Type Description
e Event

mouseup event.
Source:
Returns:
Type
void

_renderTemplate() → {void}

Render the main template and set the options container panel position as side effect.

Source:
Returns:
Type
void

_setOptionsContainerStyle() → {void}

Adjust the width and position of the options container panel based on the position of the main text input relative to the screen.

Source:
Returns:
Type
void