PhoenixFormAwesomplete

PhoenixFormAwesomplete is a Phoenix form helper that utilizes Lea Verou’s autocomplete / autosuggest / typeahead / inputsearch Awesomplete widget.

It comes with an AwesompleteUtil javascript library which adds the following features:

• Dynamic remote data loading; based on what is typed-in it performs an ajax lookup.
• Allow HTML markup in the shown items. Show value with description. Optionally search in the description text.
• Show when there is an exact match.
• Show when there isn’t a match.
• When there is an exact match show related data (supplied in the remote data) in other parts of the page.
• Select the highlighted item when tab key is used.

Examples

Explore and try these

.

Fiddle with the code yourself:

.

Installation

Installation instructions for Phoenix 1.7 and newer integrated with esbuild assets management and using function components for HEEx templates and ~H sigils.

License

MIT