Pre populate city/state fields based on Zip code

Eric Montgomery · November 2015

Is there a way to configure the donation forms to prepopulate the city/state based on just having the zip code entered--thus avoiding a couple extra fields donors have to fill out?

Brian Mucha · November 2015

There is. I heard that Noah gave a talk about how to do this at BBCon this year (though I wasn't there.)

There is a Google API that you can call that will return city and state when provided with the zip.

I'll see if my coworker has notes or a link.

Philip Nawrocki · November 2015

He did!

It is a real time look up of the zipcode entered using Google and a created API. Yes, you can create your own APIs in Luminate.

I have attached the relevant slides from his presentation.

Also, there is a working example of this is on the Make-a-Wish website:

https://secure2.wish.org/site/SPageServer?pagename=donate_now

Just click Save and Continue button at the bottom to get to the zipcode search. Scroll down on that page and put your zipcode in. You will see the city/state populate automatically to the right.

Hopefully Noah can add to this thread and add a little more insight.

Daniel Hartanto · November 2015

There is one I am aware of.

It's called "Ziptastic API"

http://ziptasticapi.com/

and basically you just make a API call like this (will return JSON)

http://ziptasticapi.com/12345

note: replace that '12345' with your intended zipcode (although, 12345 is an actual zip code)

regards,

Daniel

Brian Mucha · November 2015

https://developers.google.com/maps/documentation/javascript/examples/geocoding-simple

Noah Cooper · November 2015

If you'd like to see the JavaScript that's used on the Make-a-Wish donation form (http://site.wish.org/site/PageServer?pagename=donate), take a look at lines 234 - 345 in this file:

https://github.com/convio/make-a-wish-luminate-framework/blob/master/js/donation-form/src/donation-form.js

Pre populate city/state fields based on Zip code

Comments

Categories