How do I use autocomplete to populate a form fields based on selection

Wappler General
#1

Hi

I have a modal form and a autocomplete text field which is used to search an existing email address of a user - this works as expected.

I want to be able to choose an email from the autocomplete and then have the rest of the user fields populate from the selection.

User Form:

  • Email (used to autocomplete)
  • First name (text field)
  • Last name (text field)
  • Location (text field)

How do I do this when the issues I have to overcome is the auto complete resets itself after selection.

The query which filters down the user uses “contains” to filter by the email address. So the more the email you type the narrower the options displayed.

How on selecting the email address do I capture the user and display the results in the other fields?

There must be an easy way to do this but I have tried many options but just can not work it out.

Can anyone point me in the right direction??

Thanks!

#3

The email field should have just one binding - autocomplete. Whatever the user selects, will become the value of the field.

In the fields below, the binding should be from the SC using where email = emailinput.value.

Or, you can use data detail for simpler binding. On change event of autocomplete, you can select data binding key.