Autocomplete input value issue

[Bartek]

Wappler Version: 6.7.3
Operating System: Win10 x64
Server Model: NodeJS
Database Type: MariaDB
Hosting Type: Wappler Local Server

Expected behavior

I'm trying to add autocomplete input:

I set Global variable 'location'
I set Query Manager query1 with variable 'location'
I set API Action: https://nominatim.openstreetmap.org/search?format=json with query q={{form1.location.value}}
I made form:

<!-- Wappler include head-page="layouts/main" fontawesome_5="cdn" bootstrap5="local" is="dmx-app" id="index" appConnect="local" components="{dmxAutocomplete:{},dmxStateManagement:{}}" -->
<dmx-query-manager id="query1"></dmx-query-manager>
<meta name="ac:route" content="/">
<dmx-api-action id="api1" url="https://nominatim.openstreetmap.org/search?format=json" dmx-param:q="form1.location.value"></dmx-api-action>
<form id="form1">
    <input id="location" name="location" is="dmx-autocomplete" value="<%=_('$_GET.location')%>" dmx-bind:data="api1.data" optiontext="display_name" optionvalue="place_id" optionsearch="name">
</form>

What actually happens?

All the time variable 'location' is empty and "No results..."

Additional if I add css class "d-flex" or another with display it duplicate inputs, so I think that "style='display:none'" should be with !important attribute

[franse]

Maybe I'm wrong, but the autocomplete doesn't fetch online data when you write on it.
It expects some value as a source and then it will show them.

@Bartek

All the time variable 'location' is empty and "No results..."

You're trying to load the API with autocomplete, but autocomplete doesn't have values yet.

@mebeingken

I’m assuming the issue is that the API points back to the autocomplete for it’s search value, but the autocomplete doesn’t really have a value after the user types the same way a text input does.

Is there a Wappler way of getting this done, or am I going to need to code something?

EDIT: I have a working solution outside of Wappler, but a native solution would be great!

[franse]

PS, I've been playing with some javascript autocomplete out there but the probem is that you'll end with too much calls and nominatum/photon will throw some 429 too many requests
So ended on some text and button -> load api, and then a modal map with leaflet (and dragable marker) to confirm..