JSF 2 Update Component Outside of Form and Outside of Facelet JSF 2 Update Component Outside of Form and Outside of Facelet ajax ajax

JSF 2 Update Component Outside of Form and Outside of Facelet


The general idea of referring to an element by ID is as following:

Lets say we've got an element <p:commandButton>.

When the element is given no id JSF generates one:

<button name="j_idt191" id="j_idt191" ....

If an element is nested in a container element like a form, JSF prefixes the ID with the ID of the form:

JSF:

<h:form>    <p:commandButton/></h:form>

HTML:

<form id="j_idt48">    <button name="j_idt48:j_idt191" id="j_idt48:j_idt191" ....</form>

When there is an element in another container you need to reference from the root element. This can be done using a ":" in front of the ID. Here is an example:

<p:commandButton id="button1" update=":form:button2" ...<h:form id="form">    <p:commandButton id="button2" update=":button1" ...</h:form>

If you're not sure what ID JSF has assigned to your element, use something like FireBug to inspect the element and discover it's ID.

As far as your code, I don't think <f:subview> is generating a container element, thus you need to reference topMenuLoginForm using update=":topMenuLoginForm".


That being said, if you want to update an element using AJAX, use the update attribute. See my example above.


to Update Component Outside of Form

<p:gmap center="36.890257,30.707417" zoom="13" type="ROADMAP"                 style="width:600px;height:400px"                model="#{mapBean.simpleModel}"                onPointClick="handlePointClick(event);"                widgetVar="cliMap" fitBounds="true"                id="map">            <p:ajax event="overlaySelect" listener="#{mapBean.onMarkerSelect}"  />        </p:gmap>        <p:dialog widgetVar="dlg" showEffect="fade">            <h:form prependId="false" id="formnew">                <h:panelGrid columns="2">                    <f:facet name="header">                        <p:outputLabel value="New Point"/>                    </f:facet>                    <h:outputLabel for="title" value="Title:" />                    <p:inputText id="title" value="#{mapBean.title}" />                    <f:facet name="footer">                        <p:commandButton value="Add" actionListener="#{mapBean.newPoint()}" update=":map" oncomplete="markerAddComplete()" />                        <p:commandButton value="Cancel" onclick="return cancel()" />                    </f:facet>                </h:panelGrid>                <h:inputHidden id="Nlat" value="#{mapBean.lat}"  />                <h:inputHidden id="Nlng" value="#{mapBean.lng}" />            </h:form>        </p:dialog>

i used update=":map" to update the google map out of the formUsing Primefaces