All available callback in Places JS

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 help you to understand when callbacks are triggered.

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,
        onFeatures: (features) => {
          alert('Got new features ! ' + features.map((feature) => feature.properties.label).join('\n'));
        },
        onClose: () => {
          alert('Result list closed');
        },
        onClick: (feature) => {
          alert('Clicked on feature ' + feature.properties.label);
        },
        onError: (error) => {
          alert('Got an error ' + error);
        },
        onClear: () => {
          alert('Result list clear');
        },
      });
    </script>
  </body>
</html>