# ui1.autocompleteinput

var inputConfig = new innovaphone.ui1.AutoCompleteInputConfig(null, "small", null, "suggest", "suggest-highlight", "suggest-dropdown") var inputText = new innovaphone.ui1.AutoCompleteInput(null, null, inputConfig); function callBackData(value) { var cars = ["Saab", "Suv", "Saaa", "BatMobile", "Bms", "Bmd", "Volvo", "BMW"]; var resultArray = []; for (var i = 0; i < cars.length; i++) { if (cars[i].toLowerCase().startsWith(value.toLowerCase())) { resultArray.push(cars[i]); } } return resultArray; } inputText.setDataCallBack(callBackData); out.appendChild(inputText.container); var inputTextSpiele = new innovaphone.ui1.AutoCompleteInput(null, null, inputConfig); function callBackDataSpiele(value) { var spiele = ["Backgammon", "Schafkopf", "MauMau", "Romme", "Canaster"]; var resultArray = []; for (var i = 0; i < spiele.length; i++) { if (spiele[i].toLowerCase().startsWith(value.toLowerCase())) { resultArray.push(spiele[i]); } } return resultArray; } inputTextSpiele.setDataCallBack(callBackDataSpiele); out.appendChild(inputTextSpiele.container);

# innovaphone.ui1.AutoCompleteInputConfig(inputStyle, inputCl, suggestionStyle, suggestionCl, suggestionHighlightCl, dropDownCl, disableMultiValue)

- This config class is handed to the actual innovaphone.ui1.AutoCompleteInput class to provide styles and classes.

inputStyle
  style definitions for the input element
inputCl
  class for the input element
suggestionStyle
  style definitions for the suggestion divs
suggestionCl
  class for the suggestion divs
suggestionHighlightCl
  class for a highlighted suggestion div
dropDownCl
  class for the surrounding dropdown "box"
disableMultiValue
  disables the multi-value support (true/false)

# innovaphone.ui1.AutoCompleteInput(style, cl, config)

- Input type that supports autocomplete through a callback function

## Members

container
style
  exposes input.style
inputBox
  reference to the internal input node

## Functions

setCompleteDataCallBack(callbackCompleteValue)
  callback function executed with the complete input value when keys are pressed
triggerAutoComplete(cSuggestions)
  manually triggers the auto-complete dropdown with the given array of suggestions
setSeparator(separatorIn)
  sets the separator string used for multi-value support (default is ',')
getLastValue()
  returns the last value in case of multi-value input, or the current value if multi-value is disabled
setDataCallBack(dataCallBack)
  Set a callback function - dataCallBack(value) - that will return the autocomplete values. The function should return an array of string based on the value argument, where value is the current value from the input text
setValueSelectedCallBack(callbackValueSelected)
  Set a callback function - callbackValueSelected(value) - that function triggers if an option is selected in the UI by mouse or keyboard
value()
  returns the current value of the input
setValue(value)
  sets a new value
focus()
  sets the focus on the element
setSelectionRange(start, end)
setMaxLength(maxLength)
  sets the maximum input length
addEventListener(type, listener)
  adds events to the input element
setWidth(width)
  sets the input field width
setPlaceHolder(placeHolder)
  sets input.placeHolder (HTML5)
setOnEnter(onEnter)
  sets a function which is executed on keydown enter
setOnChange(func)
  executed if input value has changed
checked()
  get checked member of checkbox
check(checked)
  de-/activate checkbox
setType(type)
  set input.type
hasChanged()
  input value has changed?
setTitle (title)
enable()
disable()
isDisabled()