I'm using gmaps4jsf
to show Google Maps in my application, but I would like to update the map after user type his/her stret, city, state and country. This way I could give more accurate information to gmaps4jsf
dynamically.
But everytime I fill some of the fields, the maps it's gone. I'm doing this for instance with state
:
State:<h:message id="m_state" for="state" styleClass="red" /><br/>
<h:selectOneMenu id="state" value="#{propertyC.property.addressState.state}">
<f:selectItem itemLabel="" itemValue="" />
<f:selectItems value="#{addressB.states('US')}" var="state" itemValue="#{state.key}" itemLabel="#{state.value}" />
<f:ajax event="blur" render="m_state map" />
</h:selectOneMenu>
<br/>
// others fields
<m:map id="map" width="425px" height="250px" address="#{propertyC.property.street}, #{propertyC.property.addressCity.city}, #{propertyC.property.addressState.state}, #{propertyC.property.addressCountry.country}, #{propertyC.property.cep}" zoom="25" autoReshape="true" >
<m:marker>
<m:icon imageURL="http://i.imgur.com/WFJo62Q.png"/>
</m:marker>
</m:map>
How can I show the map dynamically as user type his/her address?