Autocomple
The Autocomplete component adds world-class search to your application.
How it works
An autocomplete control in a web form can greatly assist in finding your address by providing suggestions as you type, based on previously entered addresses or data from a database. This saves time and effort by reducing the need to manually enter your entire address, while also ensuring accuracy by preventing spelling errors or typos. As you type in the autocomplete field, a dropdown list of suggestions will appear, allowing you to easily select the correct address. This feature is especially useful for people who frequently move or those who have difficulty with typing or spelling.
Single context lookups
Here is example on how to search for a towns.
<lsui-autocomplete
placeholder="Town"
contexts='["town"]'>
</ls-search-bar-component>A example on how to create a address form is available in our example section.
AutoComplete
The AutoComplete search option provides suggestions whilst the user is entering their desired address. This is similar to that of Google where the user starts to type into a single line search bar and the system uses an auto-complete drop down to display possible matches to the data captured. The values entered refines the suggestions returned to be closer to the desired address, i.e. Street number, Street name and Suburb allows the AutoComplete Web Control to return closer results. This will avoid returning irrelevant records to the users search. The rows returned will reflect the first 10 results which correspond with the relevant input search criteria. The Autocomplete Search component configures to search either properties or addresses.
Here is example on how to search for a address or property.
<lsui-autocomplete
placeholder="Search for a address or property"
contexts='["address", "property"]'
isExtended="true">
</ls-search-bar-component>A example on how use autocomplete is available in our example section.
Properties and Attributes
TODO
Styling
TODO
Attributes
| Name | Description | Type |
|---|---|---|
| placeholder | a short hint that describes the expected value. | string |
| contexts | Contexts to filter on (i.e. suburb, property, town, etc). | string |
| apiKey | A valid Lightstone developer portal API key. | string |