Places Autocomplete - prevent form submission when choosing place

5,305 views
Skip to first unread message

arclyte

unread,
Sep 30, 2011, 2:18:14 PM9/30/11
to google-map...@googlegroups.com
I have an autocomplete text field tied to an 'advanced search' form.  The user flow of using this seems a bit out of sync because when have to fill out the advanced section prior to filling out the search form.  That is - if you choose a location using autocomplete, the form will automatically submit and you'll have to filter the results on the proceeding page. 

Is there any way to prevent the form submit on selecting an autocomplete location?  I'm not sure how to capture event information for a google eventlistener (if that's even possible).  I've thought about disabling the enter key on the form, but it also happens on mouse click of a location, which seems like a likely use case.

You can see the form in action at:

andreas.s...@naradana.com

unread,
Oct 9, 2011, 8:13:07 AM10/9/11
to Google Maps JavaScript API v3
I have a similar problem, and checked with Chrome debugger the
possibilities to handle it.

The bad news: google captures all the events of the input field,
before it's possible to go in-between. So it's not possible to use
event handlers of your favorite framework (in my case: dojo)

The good news: there is a workaround by using google's event handlers.
It's not nice but it works:

var input = document.getElementById('inputId');
// dojo.connect(input, 'onkeydown', function(e) {
google.maps.event.addDomListener(input, 'keydown', function(e) {
if (e.keyCode == 13)
{
if (e.preventDefault)
{
e.preventDefault();
}
else
{
// Since the google event handler framework does not handle
early IE versions, we have to do it by our self. :-(
e.cancelBubble = true;
e.returnValue = false;
}
}
});

Tested with IE8 and IE7 emulators within IE9, IE9, Firefox 4.0, Chrome
12
doctype XHTML 1.0 transitional

Have fun

Andreas
Naradana WebSolutions
Reply all
Reply to author
Forward
0 new messages