Recently I was working on a project that relied heavily on location data. It required entering addresses, over and over again. Country, state, street address, city, zip code, etc… I was thinking that there must be a better way. Turns out there is: Google Autocomplete!
I am sure you have seen stuff on the web that looks something like this:
Google Places Autocomplete advantages
This type of address input has a few advantages over allowing the user to type whatever they want. First, it gives you valid addresses from the Google Maps API. Second, it speeds up the process for the user because they don’t have to type out all the address fields. It even gives suggestions based on their location! And finally, it is just pretty darn cool.
Now with our Google Places Autocomplete Plugin for Oracle Application Express (APEX) , you can get up and running with this in just a few minutes.
Features
- Ability to map address components to multiple items.
- Ability to limit the search to different address types such as addresses, establishments, cities, and more!
- Interactive Grid (Grid example)
- Option to return abbreviated form of Address, State, and Country.
- Option to return address in JSON format. (JSON example)
- Suggest addresses closest to user’s current geolocation.
(Grid example)
(JSON example)
Google Places Autocomplete saved me a lot of time
Using this feature cut my address input time from 12 seconds to 3 seconds on average. It may not seem like a lot, but when repeating this process, it allows users to complete the task in only one quarter of the time that it usually does. That is a huge improvement in terms of time and also just the overall experience in general.
A few tips on installation of this plugin
To install this plugin, go to our github: https://github.com/insum-labs/apex-plugin-google-places-autocomplete
First download the repository. Then open APEX and go to the app you wish to install it in. Import the plugin file named “item_type_plugin_com_insum_placecomplete.sql”. After the import is done, it will ask you for an API key which is required. You can acquire one at https://developers.google.com/maps/documentation/javascript/get-api-key. That is all that it takes!
Finally, if there are any issues or enhancements you would like to request, please contact us or submit them on the github page and we will respond to them in a timely manner!
This is a very neat plugin, but I tried modifying the URL to restrict to only locations within a certain radius, but I’m obviously doing it wrong.
l_js_params := ‘?key=’ || l_api_key || ‘&libraries=places&location=-31,115&radius=5000’;
https://developers.google.com/places/web-service/autocomplete#place_types
Do you have any advice?
Hi Scott,
You are looking at where we retrieve the Google Places library javascript file : https://developers.google.com/maps/documentation/javascript/places
Replacing the values in l_js_params will not make the request that you are looking for. The next step we do is add this library to our plugin:
apex_javascript.add_library
(p_name => 'js' || l_js_params
,p_directory => 'https://maps.googleapis.com/maps/api/'
,p_skip_extension => true);
This loads the js library. Making a call to https://maps.googleapis.com/maps/api/place/autocomplete/output?parameters will return XML or JSON, not a javascript library.
To get the result you are looking for, you would have to modify the jquery.ui.autoComplete file and modify the autocomplete object, or you can run javascript on the page after the autocomplete object is initialized to do this. Could you please add this to our github as feature request? https://github.com/insum-labs/apex-plugin-google-places-autocomplete
We will try to add it to an upcoming release as a built in option.
Best,
Neil
this is very cool indeed – will it work for UK addresses? What other data can be retrieved along with the address?
Hi Ali,
Yes this will work for UK addresses. Only thing is, address terminology is different for different countries. What we consider city may be considered something else to Google.
For this reason, we return the JSON that is returned from Google to allow the developers to parse it for these situations. Please use this option for these scenarios to do as you please with the data returned.
No other data is available currently in our plugin, we allow the user to see the address_components portion of the Google Autocomplete object. In our next release we will allow the user to get the whole object, and do as they would like to retrieve other information such as place id, opening hours for business, etc. Everything that is available here: https://developers.google.com/maps/documentation/javascript/places#place_details
Hope this helps,
Neil
Hi
I’ve managed to get it to work in the Interactive Grid, and all the necessary fields are displayed on the screen when an address is entered. But when I save it, the latitude and longitude fields are nullified and does not save to the DB. Any idea what I might be doing wrong?
Niel
Hi Niel,
Thank you for pointing this out. Will add this to the bug list and hopefully have it fixed in our next release at the end of the week.
Best,
Neil
Hi, am getting an error saying This page cant load google maps correctly. Ive entered the API key and Im not seeing the requests on my google console. Am using Oracle Apex 18.2. Any idea?
Hi Andrew,
Were you able to resolve the issue?
Hi, Niel Great Plugin. Thank you very much, it’s very useful. A basic question. How to add a custom icon to the text box? In the properties of the plugin I have activated the option “Has an icon”. In appearance I define the custom icon, but it appears blank.
Hi Marco,
Unfortunately you can not use that field. I am surprised that it is even showing up as an option. I will see if I can remove that attribute. The plugin utilizes the Google Places Autocomplete object which completely replaces that apex item so you do not get your standard apex item functionality. I will put a ticket in to remove that option, or if I find a way to introduce this functionality in the future I may. But for now, that is not possible unfortunately.
Best,
Neil