Add icons to result list

Estimated reading time: 1 minute

This example uses JawgPlaces.Input to initialize a Jawg Places Input inside an HTML element on a webpage. It will activate type icons in the left side of results.

Thanks to this you will be able to recognize cities, streets, countries and POIs.

Checkout all common options available on Jawg Places JS: JawgPlaces.JawgPlacesInputOptions.

The value <YOUR_ACCESS_TOKEN> in the <script> tag must be replaced by your own access token from the Jawg Lab.

View on GitHub

<html>
  <head>
    <script src="https://api.jawg.io/libraries/jawg-places@latest/jawg-places.js?access-token=<YOUR_ACCESS_TOKEN>"></script>
  </head>
  <body>
    <input id="my-input" type="text" placeholder="Search" />
    <script>
      new JawgPlaces.Input({
        input: '#my-input',
        searchOnTyping: true,
        showResultIcons: true,
      });
    </script>
  </body>
</html>