j-SearchInput

jComponent 20 · jcomponent@20 component Example loaded with jComponent 20

Customizable search input.

Configuration:

searchicon {String} search icon (default: ti ti-search)
cancelicon {String} cancel icon (default: ti ti-times)
align {String} icon align (default: left)
placeholder {String} a plceholder
autofocus {Boolean/Number} enables auto-focus for non-mobile devices (number means a delay for auto-focus, default: false)
exec {String} a link to the function(value, element) which will be evaluated if the input is affected
NEW: realtime {Boolean} enables real-time binding (default: true)

Methods:

component.focus() focuses input
component.clear() clears input

Use it with <ui-component name="searchinput">. When the component is not loaded yet, jComponent downloads it on first use from the address in DEF.fallback (the Componentator CDN by default). Author: Peter Širka. Source: the Componentator components repository, MIT license.

example.html

<ui-component name="searchinput" path="%search" class="m"></ui-component>
<ui-bind path="%search" config="text b" class="block">Search: <b></b></ui-bind>