Auto Complete via API

[Igor_Tosic]

I would like to autofill/autocomplete Company field with API. I found on this link useful tips: Reduce Form Abandonment with Google MAP API (I have tried this example and doesn't work for me). It's something that I would reach, but not with Google Map, it's about some else API with companies list. Challenge is that we will have this field on multiple schemes. I have already fetch data with URL query in own custom schema and done autocomplete with bootstrap etc, but we would like to get dynamically in Marketo. Is it webhooks or some JavaScript functionality in Marketo form 2.0? Tips, guidelines!?

[Amit_Jain]

Hi Igor Tosic​

If I'm understanding it correctly, you wnated to autofill the company name on the Marketo form? Is the correct? Can you provide more details on how you wnat it to work? There are differnet techniques that I have seen and I guess the mostly used is that when a person start typing the company name you provide some suggestion in the drop down, is this what you are trying to achieve here?

OR

You have a few records in your database with missing company and you wnate to populate the company fields for these records? Can you be please more specific on the source of the company data?

i should be able to help once I have more details on what you are trying to do here.

Regards,
Amit

[Igor_Tosic]

Hi Amit,

This is exactly the first thing you mentioned. When you start typing the company name to get dropdown with suggestions.

I have used a simple dropdown library in my HTML template. If you need information, I am available.

BR,

Igor

[SanfordWhiteman · Accepted solution]

This CodePen -- quite ancient at this point, as it was first published in 2015! -- shows how to correctly use the Google Places Autocomplete API with a Marketo form: MktoForms2 :: Google Places Autocomplete 

The same general guidelines can be used with any autocomplete library. Use the Marketo Forms JS API every possible place you can. Do not set DOM values directly, for example, as they do not always correspond to Marketo datatypes, use setValues() instead. Unfortunately, you're unlikely to get away completely from DOM native events because the libraries out there don't have a specific integration with Marketo. So be careful using advanced Marketo features such as Visibility Rules in conjunction with such libraries as one could easily break the other.

[Kacper_Gawlik1]

Hi @SanfordWhiteman, 

I tried to apply your solution on my test Landing Page and shows error in Company field, would you be able to take a look at this?
http://na-ab29.marketo.com/lp/480-OIY-131/KGTestOnboarding_Test3.html

I generate my own Google API and enabled Google Places library but this is not seems to be the case.
Assuming there must be something with my code as when I replace my form details on your Codepen example it works fine.

Appreciate your help!

Thanks,

Kacper

[SanfordWhiteman]

You'll see this error in the console:

---

Google Maps JavaScript API error: RefererNotAllowedMapError https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-e... Your site URL to be authorized: http://na-ab29.marketo.com/lp/480-OIY-131/KGTestOnboarding_Test3.html

---

[Kacper_Gawlik1]

Thank you @SanfordWhiteman that was it!

Best,
Kacper