Map disappears on rerender

[chris]

Dear All,

I am stucking with an issue resulting from rerender of a map tag from a rich:autocomplete tag. I reduced my code to the following test case (see below): There is a map tag, which should map an address. Further there are two rich:autocomplete tags, the first for entering the address string to be mapped and the second just to leave the focus. The map tag is set to a static value in this test case to avoiud issues from communication with the server. Now if I enter and leave the address string control a rerender of the part with the map is triggered: event="blur" render="mapAddress". But instead of being rerendered the map completely disappears, while the check text is correctly updated.
What causes the map to disappear - how I can avoid this?

Thanks for any useful hint - and sorry for a similar post, if it appears, but I could not trace it anymore after posting.

Here is the jsf code:
 

<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
                             "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:m="http://code.google.com/p/gmaps4jsf/"
    template="/layout/gmapsTemplate.xhtml">

    <ui:define name="pagetitle">
        <h:outputText value="Address Geographic Mapping"
            styleClass="Captionsize" />
    </ui:define>

    <ui:define name="body">

        <h:form>
            <h:panelGrid columns="2">

                <h:panelGroup id="mapAddress">
                    <h:outputText value="show: #{addressBacking.addressString}" />
                    <m:map width="500px" height="500px"
                        address="Wall 1">
                        <m:marker />
                        <m:htmlInformationWindow
                            htmlText="Wall 1" />
                    </m:map>
                </h:panelGroup>

                <h:panelGroup>
                    <h:panelGrid border="0" columns="2">
                        <rich:autocomplete id="addressString" autofill="false"
                            showButton="true" mode="cachedAjax"
                            disabled="#{addressBacking.disabled}"
                            autocompleteMethod="#{addressBacking.getAddressStrings}"
                            value="#{addressBacking.addressString}"
                            onfocus="if(#{rich:component('addressString')}.getValue() == '') #{rich:component('addressString')}.setValue(' ');">
                            <a4j:ajax event="selectitem"
                                actionListener="#{addressBacking.onSelect}"
                                render="mapAddress" />
                            <a4j:ajax event="blur" actionListener="#{addressBacking.onBlur}"
                                render="mapAddress" />
                        </rich:autocomplete>
                        <h:outputLabel value="addressString" for="addressString" />

                        <rich:autocomplete id="postbox" autofill="false" showButton="true"
                            mode="cachedAjax" disabled="#{addressBacking.disabled}"
                            autocompleteMethod="#{addressBacking.getPostboxes}"
                            value="#{addressBacking.postbox}"
                            onfocus="if(#{rich:component('postbox')}.getValue() == '') #{rich:component('postbox')}.setValue(' ');">
                            <a4j:ajax event="selectitem"
                                actionListener="#{addressBacking.onSelect}"
                                render="mapAddress" />
                            <a4j:ajax event="blur" actionListener="#{addressBacking.onBlur}"
                                render="mapAddress" />
                        </rich:autocomplete>
                        <h:outputLabel value="postbox" for="postbox" />
                    </h:panelGrid>
                </h:panelGroup>

            </h:panelGrid>
        </h:form>

    </ui:define>

</ui:composition>

[Hazem Saleh]

In order to allow the map to be updated by Ajax response, make sure to set partiallyTriggered attribute to true as follows:

                    <m:map width="500px" height="500px"

                        address="Wall 1" partiallyTriggered="true">

                        <m:marker />
                        <m:htmlInformationWindow
                            htmlText="Wall 1" />
                    </m:map>

A working sample is here:

http://www.mashups4jsf.com/gmaps4jsf-examples2-3.0.0/pages/mashups.xhtml.source

http://www.mashups4jsf.com/gmaps4jsf-examples2-3.0.0/pages/mashups.xhtml

--
You received this message because you are subscribed to the Google Groups "gmaps4jsf-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to gmaps4jsf-de...@googlegroups.com.
To post to this group, send email to gmaps4...@googlegroups.com.
Visit this group at http://groups.google.com/group/gmaps4jsf-dev.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

--

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:
http://www.amazon.com/-/e/B002M052KY

DeveloperWorks Contributing Author
https://www.ibm.com/developerworks/mydeveloperworks/blogs/hazem/entry/ibm_developerworks_contributing_author?lang=en_us

An Apache committer, IBMer, and a technical speaker

Twitter: http://www.twitter.com/hazems