UI - Searchbox / Search bar

Card Puncher Data Processing


A searchbox is the entry of a search engine.

A bar that call a search engine


With a input/search

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


Search box may also have the following features:


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


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

Recommended Pages
Bootstrap - Select

Bootstrap permits to style the default select element but does not add any feature. The bootstrap select library aims to fill the gap: with a search box function multiple select on one line and...
Devtool Chrome Event Listener
DOM Event - Keydown

A Keydown is an input device event that tracks when a key goes down on the keyboard. keyup You can attach it to all element. This is also possible to create advanced accesskey (ie...
HTML - Accesskey Attribute (keyboard shortcut)

HTML All HTML elements may have the accesskey content attribute set. The accesskey attribute's value is used by the user agent as a guide for creating a keyboard shortcut that focuses (ie activates)...
HTML - Input Search

HTML A input search is a input element with a search type that represent a search box. It's identical to text inputs, but may be styled differently by the user agent. size is the length in...
Color Autocompletion List
How to create an Autocompletion functionality with CSS, Javascript and HTML

This article shows you how to create an search box with an autocompletion feature
Javascript - Debounce Function

A debounce is a function that: will wrap a callback function willnot let the callback function execute for each event will let the callback function execute only when a certain amount of time...
Search Engine - Search term

search terms are the words that are entered in the searchbox of a search engine. Search term can be found in the Google Search Console at the search-analytics...
UI - Popover

A popover is a overlay graphic element that shows up (pops) over the actual graphic elements when the user makes an active action on an interactive/control element such as: typing in a input box...

Share this page:
Follow us:
Task Runner