ElementCreateSearchInput

Callable

• ElementCreateSearchInput(id: string, dataCallback: () => Iterable<string>, options?: { maxLength: number; parent: Node; value: string }): HTMLInputElement

---

• Construct a search-based <input> element that offers suggestions based on the passed callbacks output.

  The search suggestions are constructed lazily once the search input is focused.

  @example

  <input type="search" id={id} list={`${id}-datalist`}>
      <datalist id={`${id}-datalist`}>
          <option value="..." />
          ...
      </datalist>
  </input>

  ---

  Parameters

  • id: string

    The ID of the to-be created search input; ${id}-datalist will be assigned the search input's datalist

  • dataCallback: () => Iterable<string>

    A callback returning all values that will be converted into a datalist <option>

  • optionaloptions: { maxLength: number; parent: Node; value: string } = null

  • maxLength: number

    Maximum input length of the search input

  • parent: Node

    The parent element of the search input; defaults to document.body

  • value: string

    Value of the search input

  Returns HTMLInputElement

  • The newly created search input