Knockout Binding for Google Places autocomplete input. Also populates sibling bindings that match address component types of the places api. That part depends on underscore.js.

AddressAutocomplete.js

ko.bindingHandlers.addressAutocomplete = {
    init: function (element, valueAccessor, allBindingsAccessor) {
        var value = valueAccessor(), allBindings = allBindingsAccessor();

        var options = { types: ['geocode'] };
        ko.utils.extend(options, allBindings.autocompleteOptions)

        var autocomplete = new google.maps.places.Autocomplete(element, options);

        google.maps.event.addListener(autocomplete, 'place_changed', function () {
            result = autocomplete.getPlace();

            value(result.formatted_address);
           
            // The following section poplutes any bindings that match an address component with a first type that is the same name
            // administrative_area_level_1, posatl_code etc. these can be found in the Google Places API documentation
            var components = _(result.address_components).groupBy(function (c) { return c.types[0]; });
            _.each(_.keys(components), function (key) {
                if (allBindings.hasOwnProperty(key))
                    allBindings[key](components[key][0].short_name);
            });
        });
    },
    update: function (element, valueAccessor, allBindingsAccessor) {
        ko.bindingHandlers.value.update(element, valueAccessor);
    }
};

usage.html

<input type="text" data-bind="addressAutocomplete: FullAddress, route: Street, locality: Suburb, administrative_area_level_1: State" />

try window.onload