जेएसएफ 2 फेसलेट के बाहर और बाहर के बाहर जेएसएफ 2 अपडेट घटक

Question

मेरे पास < ui में एक फॉर्म है: डालने का नाम = "सामग्री"/> जब मैं एपी के साथ डेटा को सहेजता हूं: कमांड बटन मैं फॉर्म और चीजों को अपडेट कर सकता हूं < ui: नाम डालें = "सामग्री"/>। लेकिन मैं पता लगाना < ui में घटकों अपडेट करने का तरीका परेशानी हो रही हूँ: src = शामिल "/ अनुभागों/मेनू/topMenu.xhtml"/>

topmenu मैं लिंक के साथ एक पैनल के लिए एक subview कि प्रदान की गई हो है अंदर

इस पर निर्भर करता है कि कोई व्यक्ति लॉग इन है या नहीं। जब वे लॉग इन होते हैं तो मैं अपना उपयोगकर्ता नाम दिखाता हूं। यदि मैं टेम्पलेट के सामग्री भाग में उपयोगकर्ता नाम अपडेट करता हूं, तो मैं UI को अपडेट करना चाहता हूं ताकि मेनू में नाम पृष्ठ रीफ्रेश किए बिना अपडेट हो। लेकिन यह एक फॉलबैक है जिसका मैं भी उपयोग कर सकता हूं। अपडेट के बाद पेज रीफ्रेश करें। लेकिन नहीं बल्कि होगा। यदि आप चाहते हैं तो मैं अधिक कोड पोस्ट करूंगा लेकिन इसे शुरू करने के लिए न्यूनतम रखने की कोशिश कर रहा हूं। CommandButton कि उपयोगकर्ता की जानकारी

<p:commandButton id="id_SubmitUserInfoPrefs" 
        value="Update" 
        action="#{userPreferences.updateUserInfo()}" styleClass="bottom_margin_2em top_margin_2em"> 
    <f:ajax execute="@form" render="@form :topMenuLoginView:topMenuLoginForm" /> 
<!-- tried adding 'update=":"topMenuLoginView:topMenuLoginForm"' as well. --> 

नीचे टेम्पलेट के मेनू के हिस्से में है सहेजता है:

<h:body> 
    <div id="wrap"> 
     <div title="Container"> 
      <ui:include src="/sections/base/header.xhtml"/> 
     </div><!-- End of Banner --> 

     <div id="baseTemplateTopMenu" title="Menu"> 
      <ui:include src="/sections/menus/topMenu.xhtml"/> 
     </div><!-- End of Menu --> 

     <div id="sbt_contentbody"> 

      <div title="Left Column"> 
       <ui:include src="/sections/base/leftsidebar.xhtml"/> 
      </div> <!-- End of Left Column --> 
      <div title="Content Column"> 
       <ui:insert name="content" /> 
      </div><!-- End of Centre Column --> 
      <div title="Right Column"> 
       <ui:include src="/sections/base/rightsidebar.xhtml"/> 
      </div><!-- End of Right Column --> 

     </div> 
     <div id="footer" title="Footer" class ="container"> 
      <ui:include src="/sections/base/footer.xhtml"/> 
     </div><!-- End of Footer --> 

     </div><!-- End of Container --> 
    </h:body> 

नीचे पी है।

<f:subview id="topMenuLoginView"> 
    <h:form id="topMenuLoginForm" prependId="false"> 
     <ul> 
      <h:panelGroup id="loginPanel" rendered="#{!user.loggedIn}"> 
       <li><h:outputLink value="javascript:void(0)" onclick="topMenuLoginDialog.show()" 
            title="login" styleClass="loginpanelclass">Log In</h:outputLink></li> 
       <li><h:link value="Register" outcome="/registration/register.xhtml" /></li> 
      </h:panelGroup> 
      <h:panelGroup id="logoutPanel" rendered="#{user.loggedIn}"> 
       <li><h:link value="#{user.nickname}" outcome="#{navigationprops.userprefs}" /> </li> 
       <li><p:commandLink action="#{webAuthenticationBean.logout}" 
            update=":topMenuLoginView:topMenuLoginForm"> 
         Logout 
        </p:commandLink> 
       </li> 
      </h:panelGroup> 
     </ul> 
    </h:form> 
</f:subview> 

Answer 1

आईडी के आधार पर एक तत्व की चर्चा करते हुए के सामान्य विचार निम्नलिखित है:

कहते हैं कि हम एक तत्व <p:commandButton> मिल गया है देता है।

जब तत्व कोई आईडी JSF दिया जाता है एक उत्पन्न करता है:

: एक तत्व एक फार्म की तरह एक कंटेनर तत्व में नीडिंत है

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

हैं, JSF फार्म की आईडी के साथ आईडी उपसर्ग JSF:

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

HTML:

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

जब किसी अन्य कंटेनर में कोई तत्व होता है तो आपको रूट तत्व से संदर्भित करने की आवश्यकता होती है। यह आईडी के सामने ":" का उपयोग करके किया जा सकता है।

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

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

क्या आप वाकई क्या आईडी JSF अपने तत्व करने के लिए सौंपा गया है, तत्व का निरीक्षण करने के FireBug की तरह कुछ का उपयोग नहीं कर रहे हैं और यह आईडी है, को खोजने हैं: यहाँ एक उदाहरण है।

जहाँ तक अपने कोड के रूप में, मुझे नहीं लगता <f:subview> एक कंटेनर तत्व जेनरेट कर रहा है, इस प्रकार आप संदर्भ topMenuLoginFormupdate=":topMenuLoginForm" का उपयोग कर की जरूरत है।

---

कहा जा रहा है कि, यदि आप AJAX का उपयोग करके कोई तत्व अपडेट करना चाहते हैं, तो अद्यतन विशेषता का उपयोग करें। ऊपर मेरा उदाहरण देखें।

Answer 2

फार्म के बाहर घटक अद्यतन करने के लिए

<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> 

मैं अद्यतन का उपयोग किया = ": map" फ़ॉर्म से बाहर गूगल मानचित्र अद्यतन करने के लिए का उपयोग Primefaces