Remove contents when input has changed

Question

This is my code: http://jsfiddle.net/spadez/6v3kbLbk/7/

var placeSearch, autocomplete;
var componentForm = {
    route: 'long_name',
    locality: 'long_name',
    administrative_area_level_1: 'long_name',
    country: 'long_name',
    postal_code: 'short_name'
};

function initialize() {
    autocomplete = new google.maps.places.Autocomplete(
    (document.getElementById('autocomplete')), {
        types: ['geocode']
    });
    google.maps.event.addListener(autocomplete, 'place_changed', function () {
        fillInAddress();
    });
}

function fillInAddress() {
    var place = autocomplete.getPlace();

    for (var component in componentForm) {
        document.getElementById(component).value = '';
        document.getElementById(component).disabled = false;
    }

    for (var i = 0; i < place.address_components.length; i++) {
        var addressType = place.address_components[i].types[0];
        if (componentForm[addressType]) {
            var val = place.address_components[i][componentForm[addressType]];
            document.getElementById(addressType).value = val;
        }
    }
}

Using google autosuggest I am able to populate the fields wit hthe returned information. However I run into a problem when the following happens:

User types in part of an address Clicks autocomplete (which fils fields) User deletes or modifies current input Uuser types in new input but doesnt click on autocomplete

This leaves the old values in the autocomplete fields. What I need is to check if the content in the field has changed, and if it has, delete the content in the fields with the red border.

Can anyone please show me how this might be done? My guess is something like this:

 $('#autocomplete').on('input', function() {
     // do something });

you can thinking about if user click on any suggest empty your input and then put a new one — Mohamed-Yousef, Dec 05 '14 at 12:10
But the issue is more about if the user clicks autosuggest for one address but changes it, it won't update the autocompleted fields — Jimmy, Dec 05 '14 at 12:23

score 0 · Accepted Answer · answered Dec 05 '14 at 12:41

0

You'll need to store the old value manually.You could use a javascript object to store values for each textbox:

function onChangeTest(textbox) {
    alert("Value is " + textbox.value + "\n" + "Old Value is " + textbox.oldvalue);
}

<input class="input hidden" id="country" disabled="true" onfocus="this.oldvalue = this.value;" onchange="onChangeTest(this);this.oldvalue = this.value;">

Demo

answered Dec 05 '14 at 12:41

ashokhein

1,048
12
38

What about using "on" or keyup? http://stackoverflow.com/questions/6458840/on-input-change-event – Jimmy Dec 05 '14 at 13:10

Remove contents when input has changed

1 Answers1