> For the complete documentation index, see [llms.txt](https://docs.mapbox.com/mapbox-search-js/llms.txt)

# Listen for Address Autofill events

This example shows how to listen for events when using Address Autofill in **Search JS Web**. The [`retrieve`](https://docs.mapbox.com/mapbox-search-js/api/web/autofill/#mapboxaddressautofill.event:retrieve) event is fired when the user selects an autofill suggestion. In the event handler, a GeoJSON feature for the selected result is used to set the `feature` property of [MapboxAddressMinimap](https://docs.mapbox.com/mapbox-search-js/api/web/minimap/#mapboxaddressminimap), showing the selected address to the user.

**JavaScript**

```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Listen for Address Autofill events</title>
<!-- Default styling. Feel free to remove! -->
<link href="https://api.mapbox.com/mapbox-assembly/v1.3.0/assembly.min.css" rel="stylesheet">
<script id="search-js" defer="" src="https://api.mapbox.com/search-js/v1.6.0/web.js"></script>
</head>
<body>
<form class="prose">
    <mapbox-address-autofill>
        <input name="address" autocomplete="shipping address-line1" placeholder="Search for an Address" class="input bg-white">
    </mapbox-address-autofill>
</form>
<div style="max-width: 678px; height: 300px; margin-top: 16px;">
    <mapbox-address-minimap></mapbox-address-minimap>
</div>
<script>

// TO MAKE THE MAP APPEAR YOU MUST
// ADD YOUR ACCESS TOKEN FROM
// https://account.mapbox.com
const ACCESS_TOKEN = 'YOUR_MAPBOX_ACCESS_TOKEN';

window.addEventListener('load', () => {
    const autofill = document.querySelector('mapbox-address-autofill');
    const minimap = document.querySelector('mapbox-address-minimap');

    autofill.accessToken = ACCESS_TOKEN;
    minimap.accessToken = ACCESS_TOKEN;

    autofill.addEventListener('retrieve', (event) => {
        const featureCollection = event.detail;
        if (!featureCollection || !featureCollection.features.length) {
            minimap.feature = null;
            return;
        }

        const feature = featureCollection.features[0];
        minimap.feature = feature;
    });
});
</script>

</body>
</html>
```