Umbraco 7 Custom Property Editor

Question

I'm using Umbraco 7.4 and I've created a custom google map property editor which has the autocomplete feature enabled on the map.

I've created a separate standard textbox property below the google map property on my document type, and when the user selects an autosuggestion from google's autocomplete feature, I have it updating the value of the standard textbox property but when I save & publish the node, the value isn't actually stored with the textbox. It's odd because if I manually write in text to the textbox and publish, it stores the data just fine. I'm a jQuery developer by nature so I was kind of surprised to see that the syntax worked inside of the Angular controller...any help would be much appreciated!

The event listener where I'm updating the textbox value (last line)

autocomplete.addListener('place_changed', function () {
                infowindow.close();
                var place = autocomplete.getPlace();
                if (!place.geometry) {
                    return;
                }
                var coords = new google.maps.LatLng(place.geometry.location.lat(), place.geometry.location.lng());
                    map.setCenter(coords);

                // Set the position of the marker using the place ID and location.
                marker.setPlace({
                    placeId: place.place_id,
                    location: coords
                });
                marker.setVisible(true);

                infowindow.setContent('<div><strong>' + place.name + '</strong><br>' +
                    'Place ID: ' + place.place_id + '<br>' +
                    place.formatted_address);
                infowindow.open(map, marker);
                codeLatLng(coords, geocoder);
                $('#googlePlaceID').val(place.place_id).text(place.place_id);
            });

user3267755 user3267755 · Accepted Answer · 2016-03-17T12:16:41

I came up with a kind-of hacky solution to guide Angular into seeing that text was written on the other textbox property editor but it works. I replaced the last line in the original codeblock with:

        $('#googlePlaceID').select().focus().val(place.place_id);
        var e = document.getElementById('googlePlaceID');
        var $e = angular.element(e);
        $e.triggerHandler('input');

Umbraco 7 Custom Property Editor

1 Answers