Skip to content

algolia/demo-textarea-autocomplete

Repository files navigation

Textarea autocomplete demo

This is a sample project implementing a dropdown search (triggered by the @ character) directly inside a textarea using Algolia.

Textarea dropdown

You can try the live demos or follow the guide to build your own.

Features

  • A @mention feature where users can reference people, places, resources, ...
  • A Twitter-like hashtag feature
  • An 'Advanced search UI', with dynamic refinements: see Abacus blogpost

Variations

We build 4 variations on the same principle, with increasing complexity. Feel free to have a look at the code or read the guide to see how to build your own.

Basic autocomplete (source code) With picture (source code)
Basic autocomplete Autocomplete with pictures
Rich HTML textarea (source code) With picture (source code)
Rich HTML textarea Full HTML textarea with picture

Data

The dataset is coming from themoviedb.org and contains the list of the 500 more popular actors.

Deploy

The demo website can be deployed on GitHub pages by running npm run deploy.

About

Demo code illustrating how to do an autocomplete dropdown inside a textarea with Algolia

Resources

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published