Comment faire de la saisie semi-automatique de l'adresse de domaine avec l'api google maps?

Below I split all the details of formatted address like City, State, Country and Zip code. 
So when you start typing your street name and select any option then street name write over street field, city name write over city field and all other fields like state, country and zip code will fill automatically. 
Using Google APIs.
------------------------------------------------
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', function() {
var places = new google.maps.places.Autocomplete(document
.getElementById('txtPlaces'));
google.maps.event.addListener(places, 'place_changed', function() {
var place = places.getPlace();
var address = place.formatted_address;
var  value = address.split(",");
count=value.length;
country=value[count-1];
state=value[count-2];
city=value[count-3];
var z=state.split(" ");
document.getElementById("selCountry").text = country;
var i =z.length;
document.getElementById("pstate").value = z[1];
if(i>2)
document.getElementById("pzcode").value = z[2];
document.getElementById("pCity").value = city;
var latitude = place.geometry.location.lat();
var longitude = place.geometry.location.lng();
var mesg = address;
document.getElementById("txtPlaces").value = mesg;
var lati = latitude;
document.getElementById("plati").value = lati;
var longi = longitude;
document.getElementById("plongi").value = longi;            
});
});

Je doute vraiment qu'il--de l'API google maps est idéal pour le géocodage d'adresses connues, mais il est généralement données sur le rendement qui est adapté pour la saisie semi-automatique-style opérations. Passons sur le défi de ne pas frapper l'API de façon de manger jusqu'à votre limite de requête de géocodage très rapidement.

Il y a quelques impressionnantes bibliothèques comme select2, mais il ne correspond pas à mon besoin.
J'ai fait un échantillon à partir de zéro afin d'utiliser une simple saisie de texte.

Je ne l'utilise bootstrap et JQuery, j'Espère qu'elle sera utile: Exemple

HTML:

<div class="form-group col-md-12">
<label for="address">Address</label>
<input type="text" class="form-control" id="address">
</div>
<div class="form-group">
<div class="col-md-4">
<label for="number">number</label>
<input type="text" class="form-control" id="number">
</div>
<div class="col-md-8">
<label for="street">street</label>
<input type="text" class="form-control" id="street">
</div>  
</div>
<div class="form-group">
<div class="col-md-4">
<label for="zip">zip</label>
<input type="text" class="form-control" id="zip">
</div>
<div class="col-md-8">
<label for="town">town</label>
<input type="text" class="form-control" id="town">
</div>  
</div>
<div class="form-group">
<div class="col-md-4">
<label for="department">Department</label>
<input type="text" class="form-control" id="department">
</div>
<div class="col-md-4">
<label for="region">Region</label>
<input type="text" class="form-control" id="region">
</div>  
<div class="col-md-4">
<label for="country">Country</label>
<input type="text" class="form-control" id="country">
</div>  
</div>

JS:

$("input#address").suggest({
label : "Adresse complete", 
street_number_input : {
id : "number",
label : "Numero de la rue"
},
street_name_input : {
id : "street",
label : "Nom de la rue"
},
zip_input : {
id : "zip",
label : "Code postal"
},
town_input : {
id : "town",
label : "Ville"
},
department_input : {
id : "department",
label : "Departement"
},
region_input : {
id : "region",
label : "Region"
},
country_input : {
id : "country",
label : "Pays"
}
});