Jquery Geocomplete
by nicolas tenorio
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/geocomplete/1.7.0/jquery.geocomplete.min.js"></script>
<form>
<div class="item">
<input id="autocomplete" placeholder="Look up your address" type="text"></input>
</div>
<div class="item" >
<input class="cat_textbox" id="houseNo" data-geo="street_number" type="text" placeholder="House Number" maxlength="50" />
</div>
<div class="item">
<input class="cat_textbox" id="street" data-geo="route" type="text" placeholder="street" maxlength="50" />
</div>
<div class="item">
<input class="cat_textbox red" id="BillingAddress" data-geo="street_address" type="text" placeholder="Billing Address" maxlength="50" name="BillingAddress" />
</div>
</form>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=places"></script>
CSS
input{
width: 50%;
height: 35px;
padding: 5px;
margin: 5px;
}
.red{
border: 1px #D92124 solid;
}
JavaScript
$(document).ready(function() {
$("#autocomplete").geocomplete({
details: "form div",
detailsAttribute: "data-geo"
})
$(".pc-container").append("<p>cas</p>");
})