Templates
Template Setup Guides

Fastest Google Places Autocomplete Plugin

Link to plugin page: https://zeroqode.com/plugin/google-places-autocomplete-1544612805685x644407669572501500

Introduction

This is a client side version of Google Places Autocomplete service because it runs in the client's browser instead of Bubble server and also for that reason it retrieve's user's accurate location (not Bubble server).

Prerequisites

Google API Key (https://cloud.google.com/maps-platform/places/)

For users who are setting their own custom domain to application, place your Google Map API and Google Geocode API keys in order to you use the plugin with a Map element in the Bubble application: Settings > General tab > General services api keys.

Settings for Google Map and Google Geocode APIs

Available Fields

Fields:

  1. “Map element present on the page?’ (Checkbox) - REQUIRED - default unchecked.

  2. Input ID (Dynamic text value) - REQUIRED - can’t be empty.

  3. Place Type (Dropdown) - REQUIRED - default ‘all’.

  4. Results Language (Dropdown) - REQUIRED - default ‘English’.

  5. Country (Dropdown) - REQUIRED - default ‘All’.

  6. Countries (Dynamic list of text) - OPTIONAL

  7. Latitude (Dynamic number) - OPTIONAL

  8. Longitude (Dynamic number) - OPTIONAL

  9. Radius (Dynamic number) - OPTIONAL

Available States and Events

States:

  1. Full Address (Text)

  2. Place Icon (Text)

  3. Place Name (Text)

  4. Position Lat & Long (List of numbers)

  5. Place ID (Text)

  6. Place Photo (Text)

  7. Website (Text)

Update 09.10.19 Changelog:

Added new state fields:

  1. Phone Number: (number)

  2. International Phone Number: (number)

  3. Opening Hours List: (text)

  4. Is Open Now: (yes/no)

  5. Rating: (number)

  6. User Ratings Total: (number)

Events:

  1. New Position

Installation and usage

As a start you need to install the plugin. After installing the last version, just follow the next steps:

  1. Fill the API Key input in the plugins tab.

  2. Put the Google Autocomplete element on the page.

  3. (IMPORTANT) Be careful about the first field in the plugin element. You need to check the checkbox “Map element present on the page?” if you are using a standard bubble Map element on the same page as Google Autocomplete element. If you are not using the standard Map element just leave it unchecked.

  4. (IMPORTANT) Input ID must be filled also. For this, you need to add an input element on the same page, give it an ID, after that you can use the ID in the Google Autocomplete element.

  5. (OPTIONAL) Place Type, just choosing the type of searching content. It can be the following:

  6. (OPTIONAL) Results Language, language for the results: and many more languages.

  7. (OPTIONAL) Country, the country where to search for results: and many more countries, about 246.

Countries parameter can be only a bubble list of text, for example, from the Bubble database, extracted using the “Do A Search” method.

Latitude, Longitude, Radius can be used for an area of search.

Demo to preview the settings