How to use autocomplete of calcite-input-text?

476
4
10-18-2023 11:44 AM
ForrestLin
Occasional Contributor

How to use autocomplete of calcite-input-text? Please provide an example.

0 Kudos
4 Replies
KittyHurley
Esri Contributor

Calcite leverages autocomplete, which provides autofill from the user-agent, and may require the following of the component:

  1. The component is provided with a "name" and/or "id" attribute,
  2. The component is housed within a form, and/or
  3. The form also contains a submit button
0 Kudos
ForrestLin
Occasional Contributor

Any example? Sample code?

 

Thanks

0 Kudos
KittyHurley
Esri Contributor

@ForrestLin you can refer to the MDN example in the above thread for the specifics. Below are examples with Calcite and native elements, depending on the user agent:

<!-- Native  example -->
<!-- <label for="firstName">First Name:</label>
<input name="firstName" id="firstName" type="text" autocomplete="given-name" /> -->

<!-- Calcite example -->
<calcite-label for="firstName">First Name:</calcite-label>
<calcite-input name="firstName" id="firstName" autocomplete="given-name"></calcite-input>

 

0 Kudos
ForrestLin
Occasional Contributor

Hello Kitty,

Thank you!

Is it possible to auto-complete input data from backend: web api/service, database?

ForrestLin_4-1701790647479.png
ForrestLin_3-1701790589838.png

 

 

 

 

 

 

 

 

0 Kudos