updating the map from an inputtext using ajax

155 views
Skip to first unread message

Pablo Estades

unread,
Feb 13, 2011, 9:41:31 PM2/13/11
to gmaps4jsf-dev
Hi,

I'm new to this great lib and I'd like to ask a question.

I'm looking for the map to update using ajax, similar to the country/
city sample but instead of using a commandlink, I want to update it
when the inputtext loses the focus.

It's not working for me and I'm wandering if it is possible.

Here is my code:

<h:form>
<h:panelGrid columns="2">
<h:outputText value="Name" />
<h:inputText value="#{alertView.name}" />
<h:outputText value="Address" />
<h:inputText id="address" value="#{alertView.address}">
<f:ajax render="mapGroup">
<f:param name="addr" value="#{alertView.address}"/>
</f:ajax>
</h:inputText>
</h:panelGrid>

<h:panelGroup id="mapGroup">
<m:map id="map" width="460px" height="460px"
type="G_NORMAL_MAP"
address="#{param.addr}"
renderOnWindowLoad="false" zoom="4">
<m:marker id="marker"/>
<m:htmlInformationWindow id="window" htmlText="dir"/>
</m:map>
</h:panelGroup>

</form>

thanks a lot,
Pablo.

Hazem Saleh

unread,
Feb 14, 2011, 6:33:03 AM2/14/11
to gmaps4...@googlegroups.com
If you are using GMaps4JSF 1.1.4 then
replace
renderOnWindowLoad="false"
with
partiallyTriggered="true"

Please tell me if you have any further issues.


--
You received this message because you are subscribed to the Google Groups "gmaps4jsf-dev" group.
To post to this group, send email to gmaps4...@googlegroups.com.
To unsubscribe from this group, send email to gmaps4jsf-de...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/gmaps4jsf-dev?hl=en.




--
Hazem Ahmed Saleh Ahmed

Author of (The Definitive Guide to Apache MyFaces and Facelets):
http://www.amazon.com/Definitive-Guide-Apache-MyFaces-Facelets/dp/1590597370
http://www.amazon.com/-/e/B002M052KY

Visualize and share your social networks 2D and 3D:

Pablo Estades

unread,
Feb 15, 2011, 11:34:57 AM2/15/11
to gmaps4...@googlegroups.com
Thanks for the anwers.

Yes, I'm using GMaps4JSF 1.1.4.
I tried your change but still is not working.
Any other options?

Thanks a lot,
Pablo.

2011/2/14 Hazem Saleh <haz...@apache.org>



--
Pablo.

Hazem Saleh

unread,
Feb 15, 2011, 12:33:18 PM2/15/11
to gmaps4...@googlegroups.com
Which JSF implementation are you using? and which JSF 2 build?

I suspect that the Ajax parameter is not sent well, so replace the map with an output text that show the passed address, and tell me the results.


               <h:form>
               <h:panelGrid columns="2">
                       <h:outputText value="Name" />
                       <h:inputText value="#{alertView.name}" />
                       <h:outputText value="Address" />
                       <h:inputText id="address" value="#{alertView.address}">
                               <f:ajax render="mapGroup">
                                       <f:param name="addr" value="#{alertView.address}"/>
                               </f:ajax>
                       </h:inputText>
               </h:panelGrid>

       <h:panelGroup id="mapGroup">
           <h:outputText value="#{param.addr}"/>
       </h:panelGroup>

Pablo Estades

unread,
Feb 15, 2011, 12:49:41 PM2/15/11
to gmaps4...@googlegroups.com
I updated mojarra to 2.0.4 and now is working. Thank a lot :)

2011/2/15 Pablo Estades <pest...@gmail.com>

I'm using Mojarra 2.0.0 (SNAPSHOT b10) from your mashupjsf2 project.


Yes, ajax with the inputtext is working properly, this is the first thing I tried when the map failed.


I forgot to mention that the map is initially displayed fine and the the inputtext loses the focus it disappears.


Pablo.



2011/2/15 Hazem Saleh <haz...@apache.org>



--
Pablo.



--
Pablo.

Pablo Estades

unread,
Feb 15, 2011, 12:45:41 PM2/15/11
to gmaps4...@googlegroups.com

I'm using Mojarra 2.0.0 (SNAPSHOT b10) from your mashupjsf2 project.


Yes, ajax with the inputtext is working properly, this is the first thing I tried when the map failed.


I forgot to mention that the map is initially displayed fine and the the inputtext loses the focus it disappears.


Pablo.



2011/2/15 Hazem Saleh <haz...@apache.org>
Which JSF implementation are you using? and which JSF 2 build?



--
Pablo.

Hazem Saleh

unread,
Feb 15, 2011, 12:58:25 PM2/15/11
to gmaps4...@googlegroups.com
I know it is not GMaps4JSF bug ;).

shekar s

unread,
Feb 16, 2011, 7:25:36 AM2/16/11
to gmaps4...@googlegroups.com
Hi.

i am using gmaps4jsf.jar, i  give to lat/long value application,it convert location name and area code..
send sample code..

Thanks


By Chandrasekaran

Hazem Saleh

unread,
Feb 16, 2011, 8:09:10 AM2/16/11
to gmaps4...@googlegroups.com
Hi Shaker,

If you want to get the address from the longitude and latitude then you should use the GMaps4JSF Geocoder service, here is an example:
http://www.mashups4jsf.com/gmaps4jsf-examples/pages/reverseGeocoding.jsf

Checkout the complete source from:
http://code.google.com/p/gmaps4jsf/source/checkout

--
You received this message because you are subscribed to the Google Groups "gmaps4jsf-dev" group.
To post to this group, send email to gmaps4...@googlegroups.com.
To unsubscribe from this group, send email to gmaps4jsf-de...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/gmaps4jsf-dev?hl=en.

Hazem Saleh

unread,
Jun 30, 2012, 11:28:09 AM6/30/12
to gmaps4...@googlegroups.com
 Which RichFaces version are you using?

On Fri, Jun 29, 2012 at 9:34 PM, Nick <srikant...@gmail.com> wrote:
Hi Hazem,
 
I'm new to gmaps4jsf..  great work!..  love gmaps4jsf..  
My issue: I have problem maintaining zoom level..
I tried using save state etc but not successful...

Here is my code..

 <h:inputText id="inputValue" size="50" value="#{beanObj.numb}" >
  <a4j:support id="ajxSupp" event="onchange" immediate="false"  reRender="locationData" />
  </h:inputText>
         
 
<h:panelGroup id="locationData">
 <t:outputText value="#{beanObj.longitude}<br>" escape="false" ></t:outputText>
 <t:outputText value="#{beanObj.latitude}" escape="false" ></t:outputText>
  <m:map id="mapGoogle" jsVariable="g_mapVar" autoReshape="true" partiallyTriggered="true" zoom="#{beanObj.zoom}" type="G_NORMAL_MAP" width="350" height="300" enableScrollWheelZoom="true">
   <m:mapControl id="mapControlZoom" name="GSmallMapControl" position="G_ANCHOR_BOTTOM_RIGHT" offsetHeight="5" offsetWidth="5"></m:mapControl>
   <m:marker latitude="#{beanObj.machineLongitude}" longitude="#{beanObj.machineLatitude}"></m:marker>
  </m:map>
 </h:panelGroup>

I see ajax working well... outputText was showing values also marker was getting shown properly.. but zoom was too high..
I kep zoom set as 4 ( basically it is hard coded in bean...but the moment ajax gets trigged..  it is gone..
Need your help on this..
 
 
Thanks
Nick!
 

On Wednesday, February 16, 2011 8:09:10 AM UTC-5, Hazem Saleh wrote:
Hi Shaker,

If you want to get the address from the longitude and latitude then you should use the GMaps4JSF Geocoder service, here is an example:
http://www.mashups4jsf.com/gmaps4jsf-examples/pages/reverseGeocoding.jsf

Checkout the complete source from:
http://code.google.com/p/gmaps4jsf/source/checkout

On Wed, Feb 16, 2011 at 2:25 PM, shekar s <sheka...@gmail.com> wrote:
Hi.

i am using gmaps4jsf.jar, i  give to lat/long value application,it convert location name and area code..
send sample code..

Thanks


By Chandrasekaran

--
You received this message because you are subscribed to the Google Groups "gmaps4jsf-dev" group.
To post to this group, send email to gmaps4...@googlegroups.com.
To unsubscribe from this group, send email to gmaps4jsf-dev+unsubscribe@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/gmaps4jsf-dev?hl=en.



--
Hazem Ahmed Saleh Ahmed

Author of (The Definitive Guide to Apache MyFaces and Facelets):
http://www.amazon.com/Definitive-Guide-Apache-MyFaces-Facelets/dp/1590597370
http://www.amazon.com/-/e/B002M052KY

Visualize and share your social networks 2D and 3D:

--
You received this message because you are subscribed to the Google Groups "gmaps4jsf-dev" group.
To view this discussion on the web visit https://groups.google.com/d/msg/gmaps4jsf-dev/-/ZKokSgIsmVYJ.

To post to this group, send email to gmaps4...@googlegroups.com.
To unsubscribe from this group, send email to gmaps4jsf-de...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/gmaps4jsf-dev?hl=en.



--
Hazem Ahmed Saleh Ahmed

Author of (The Definitive Guide to Apache MyFaces and Facelets):

Hazem Saleh

unread,
May 20, 2013, 5:35:24 PM5/20/13
to roberto...@gmail.com, gmaps4jsf-dev
Please file an issue in the issues list and we will investigate this scenario:
http://code.google.com/p/gmaps4jsf/


On Mon, May 20, 2013 at 7:53 PM, <roberto...@gmail.com> wrote:
Hi Hazem,

  I´m facing the same problem that Pablo Estades (above), but the solution provided is not working for me.

I have a JSF1.2 + richfaces 3.3.3 application with Gmaps4JSF 1.1.4. 

I have a comboBox with different addresses values loaded. Below that, I have a map which is correctly loaded and displayed with the default address. When this comboBox value changes, to select another address an ajax action is fired and after that, the map should be reRendered with the new address. The problem is: the action is working and the panel is reRendered because I´m showing the comboBox value. However the map (that initially is working), becomes grey (powered by Google and Terms and conditions links are displayed, but the map is grey). Any idea?

please find my code: 


<h:outputText value="#{msj.puerto} (*)" styleClass="labelText" />
<div class="clear" />
<rich:comboBox id="puertoBarco"
  label="puerto"   
  value="#{BarcosBean.puerto}"
    defaultLabel="#{msj.seleccionePuerto}" 
  suggestionValues="#{BarcosBean.puertos}"
  styleClass="marginBottom20"
  inputClass="comboBoxInput"
  inputDisabledClass="comboBoxInputDisabled"
  inputInactiveClass="comboBoxInputInactive"
  width="255"
  required="true" 
  requiredMessage="#{msj.puertoObligatorio}">
<a4j:support event="onchange" action="#{BarcosBean.getUbicacionBarco}" status="esperaStatus"
reRender="ubicacion" ajaxSingle="true" />
</rich:comboBox>
<div class="clear" />
<perris:ubicacion direccion="#{BarcosBean.direccionUbicacionBarco}" zoom="16" nombre="#{BarcosBean.barco.nombre}" draggable="true"/>

<!-- This is perris:ubication.xhtml tag>
<ui:composition>
<a4j:outputPanel id="ubicacion">
<h:outputText value="#{msj.direccion}" styleClass="labelText" />
<div class="clear" />
<h:inputText value="#{direccion}" styleClass="perrisInput" />
<div class="clear" />
<div class="map">
          <m:map id="mapaPrueba" 
            enableScrollWheelZoom="true" 
            width="500" 
            height="450" 
            address="#{direccion}" 
            zoom="#{zoom}"
            partiallyTriggered="true">
          <m:mapControl name="GLargeMapControl" />
              <m:marker>
                  <m:htmlInformationWindow htmlText="#{EmpresasBean.empresa.nombre}" />
               </m:marker>
           </m:map>
            </div>
        </a4j:outputPanel>
                
</ui:composition> 

as you can see i´m using partiallyTriggered="true" but it´s still not working.

Thanks,
Roberto.



--
Hazem Ahmed Saleh Ahmed

Author of JavaScript Unit Testing book:
http://www.amazon.com/dp/1782160620/

Co-author of (The Definitive Guide to Apache MyFaces and Facelets) book:
Reply all
Reply to author
Forward
0 new messages