Table of Contents

About

A searchbox or search bar is a combobox where the user enters a search term that should be searched in a collection of documents.

The search may be:

  • local in a list of rows (the document being a row)
  • remote against a database such as a search engine.

Example

HTML Basic

A search box in HTML is done with a input/search 

<label for="searchId">Search: </label> 
<input id="searchId"  name="searchName" type="search"  placeholder="search term" />
Rendered by WebCode

Search box with Autocompletion

How to create an Autocompletion functionality with CSS, Javascript and HTML

Usage

  • retrieving documents similar to the search term
  • filtering a list of documents

Feature

Search box may also have the following features:

  • autocompletion feature that will show a list of possible search term
  • debounce: when the user enters the search term, the search box will not search for every keystroke.

Library

Name AutoComplete List Filtering
Floating ui Yes Yes
auto-complete Yes No
omnisearch (Demo) Yes No
listjs No Yes

Metadata

If you want to advertise your own search engine or discover them, check this article: Search Engine - How to advertise your website engine