Problems with map rerender from rich:autocomplete

70 views
Skip to first unread message

chris

unread,
Jul 31, 2013, 2:35:08 PM7/31/13
to gmaps4...@googlegroups.com
Dear All,

I want to build a highly interactive application for editing geographic data. Now I stuck with a problem of loosing the map when triggering a rerender. Below I have the jsf code reduced to isolate the issue. Basically it is a map tag, which should map from address strings and two rich:autocomplete tags. The first one I use to enter an address string, which should be displayed in the map. But to exclude issues from communication with the backing in this test case the map tag is set to a fixed address ("Wall 1"), which works. Of course the issue is the same, if I would set address="#{addressBacking.addressString}" and htmlText="#{addressBacking.addressString}", which is finally my intention. After entering and leaving the addressString autocomplete box, the part with the map is to be rerendered (event="blur" render="mapAddress"). When this is triggered, the map completely disappears instead of being rerendered, while the check text <h:outputText value="show: #{addressBacking.addressString}" is correctly updated, if I entered anything in the control.
The backing functionality for this test case is trivial: Just getter and setter for addressString and empty functions with loggers for onSelect and onBlur. Anyway the map tag is static without any communication with the server. I am using Gmaps4jsf 3.0.1-SNAPSHOT and Richfaces 4.3.2.Final.
What is the cause for the map disappearing - what can I do to avoid this odd behaviour?

Many thanks in advance for any useful hint.

Chris

Below 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="#{addressBacking.addressString}" />
                    </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>



Reply all
Reply to author
Forward
0 new messages