1 Reply Latest reply on Nov 13, 2013 2:01 AM by reda gamea

    rich:popupPanel now showing up

    P S Newbie

      Hi

      I have two html files one contains button and other contains the popup. I want to open the popup on button click in first file.

      Here is my code

      authGroupManagement.xhtml

       

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

       

       

      <html xmlns="http://www.w3.org/1999/xhtml"

        xmlns:h="http://java.sun.com/jsf/html"

        xmlns:f="http://java.sun.com/jsf/core"

        xmlns:ui="http://java.sun.com/jsf/facelets"

        xmlns:a4j="http://richfaces.org/a4j"

        xmlns:rich="http://richfaces.org/rich">

      <head>

      <script>

      function radioButton(radio) {

      var id = radio.name.substring(radio.name.lastIndexOf(':'));

      var el = radio.form.elements;

      for (var i = 0; i &lt; el.length; i++) {

      if (el[i].name.substring(el[i].name.lastIndexOf(':')) == id) {

      el[i].checked = false;

      }

      }

      radio.checked = true;

      }

      </script>

      </head>

      <body>

        <ui:composition template="/templates/vcsMasterLayout.xhtml">

        <ui:define name="header">

          Manage Authorities Groups Page

        </ui:define>

       

       

        <ui:define name="content">

        Home > Manage Authorities Group

        <h:form id="form">

        <div align="left">

        <rich:panel id="inputpanel" style="width:80%">

        <f:facet name="header">

        <h2 align="left">Search Groups</h2>

        </f:facet>

        <br></br>

        <br></br>

        <div align="left" style="margin-left: 10px">

        <h:panelGrid columns="4">

           Group Code:  

        <h:inputText

            id="authgrpcode"

              value="#{authGroupManagementUIController.authGroupCode}"

              size="30" maxlength="70"    

              required="#{empty param['form:authgrpname']}"

          requiredMessage="#{facesResource.valerr_reqauthgrpcode}" >

             

           </h:inputText>

        

        Group Name:  

       

            <h:inputText

              id="authgrpname"

              value="#{authGroupManagementUIController.authGroupName}"

              size="30" maxlength="70"

        >

           

           </h:inputText>

           </h:panelGrid>

        </div>

        

         <br></br>

        <div align="right" style="margin-right : 10px">

          <h:panelGrid columns="2">

        <h:commandButton  id="search" value="Search"

             action="#{authGroupManagementUIController.searchAuthoritiesGroup}"

                 render="@all"

            >

        </h:commandButton>            

          <h:commandButton  value="Reset" type="reset">

          </h:commandButton>

        </h:panelGrid>

        </div>

        </rich:panel>

        </div>

       

       

          

        <rich:panel id="groupsPanel" style="width:80%"

        rendered="#{not empty authGroupManagementUIController.authGroupName or

        not empty authGroupManagementUIController.authGroupCode}"

         onRowMouseOver="this.style.backgroundColor='#FFFFAA'">

       

       

       

       

       

               <rich:dataTable style="width:80.5%" id="groups" var="groups"

                     value="#{authGroupManagementUIController.serachResult}"

                     onRowMouseOver="this.style.backgroundColor='#FFFFAA'"

                     onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'"

                     rowSelection="single"

                >

                    

              

              

              

                       <f:facet name="header">

                <rich:columnGroup>

                <rich:column>

                <h:outputText value="Select"/>

                </rich:column>

                <rich:column>

                <h:outputText value="Group Code">

                </h:outputText>

                  </rich:column>

                <rich:column>

                <h:outputText value="Group Name">

                </h:outputText>

                  </rich:column>

                </rich:columnGroup>

                </f:facet>

              

                <rich:columnGroup>

                <rich:column>

                <a4j:commandLink value="Select this Group"

        execute="@this" >

        <a4j:param name="authGrpId" value="#{groups.id}" assignTo="#{authGroupManagementUIController.rowid}" >

        </a4j:param>

        </a4j:commandLink>

        </rich:column>

              

                    

                <rich:column>

                      <h:outputText id="tableid" value="#{groups.id}"> 

                      

                        </h:outputText>         

                       </rich:column>

                       <rich:column>

                          <h:outputText value="#{groups.name}"/>

                                          </rich:column>

                       </rich:columnGroup>

                </rich:dataTable>

            

                <div align="right" style="margin-right : 10px">

        <h:panelGrid id="buttons" columns="2" 

        >

                    <a4j:commandButton id="Add" value="Add New" type="submit"

                  action="#{authGroupManagementUIController.initAddModifyAuthoritiesGroup}"

                  render="addPopupForm:addPopupOp"

             

                    >

                 

                      <a4j:param value="true" assignTo="#{authGroupManagementUIController.newAuthoritiesGroupInd}" ></a4j:param>

                     

                     </a4j:commandButton>

                   

               <a4j:commandButton id="Modify" value="Modify"  type="submit"

                    action="#{authGroupManagementUIController.initAddModifyAuthoritiesGroup}"

                    render="modifyPopupForm:modifyPopupOp"

                   

                 >

                    

                    <a4j:param value="false" assignTo="#{authGroupManagementUIController.newAuthoritiesGroupInd}" ></a4j:param>

                 

                 </a4j:commandButton>

               

               </h:panelGrid>

               </div>

               </rich:panel>

               <a4j:outputPanel ajaxRendered="true">

           <h:message for="authgrpcode" style="color:red"/>  

              </a4j:outputPanel>

          

            

              </h:form>

               <a4j:log popup="false" level="ALL" style="width: 800px; height: 300px;"></a4j:log>

        </ui:define>

        </ui:composition>

      </body>

      </html>

       

      addPopup.xhtml

       

      <ui:composition xmlns="http://www.w3.org/1999/xhtml"

        xmlns:ui="http://java.sun.com/jsf/facelets"

        xmlns:h="http://java.sun.com/jsf/html"

        xmlns:f="http://java.sun.com/jsf/core"

        xmlns:a4j="http://richfaces.org/a4j"

        xmlns:rich="http://richfaces.org/rich">

       

      <h:form id="addPopupForm">

       

       

      <a4j:outputPanel id="addPopupOp">

      <rich:popupPanel id="addPopup" domElementAttachment="parent" show="true" zindex="2"

        rendered="true" height="600" width="1000" >

        <f:facet name="header" >

         <h:panelGroup>

          <h:outputText id="addnewhdr" value="Add Authorities Group"/>

       

       

         </h:panelGroup>

          </f:facet>

          <f:facet name="controls">

           <div align="left" style="margin-left: 10px">

        <h:panelGrid columns="4">

           Group Code:  

        <h:inputText

            id="addauthgrpcode"

              value="#{authGroupManagementUIController.selectedAuthoritiesGroup.id}"

              size="30" maxlength="70"

              requiredMessage="#{facesResource.valerr_reqauthgrpcode}"

              required="true">

           </h:inputText>

        Group Name:  

            <h:inputText

              id="addauthgrpname"

              value="#{authGroupManagementUIController.selectedAuthoritiesGroup.name}"

              size="30" maxlength="70"

              requiredMessage="#{facesResource.valerr_reqauthgrpname}"

              required="true">

           </h:inputText>

           </h:panelGrid>

        </div>

        </f:facet>

        <rich:dataTable value="#{authGroupManagementUIController.allAuthorities}" var="authList">

        <f:facet name="header">

        <rich:columnGroup>

        <rich:column>

          <h:selectBooleanCheckbox name="check" id="autho"

           onClick="checkedAll();">

          </h:selectBooleanCheckbox>

        </rich:column>

            <rich:column>

         <h:outputText value="Authorities"/>

        </rich:column>

           </rich:columnGroup>

        </f:facet>

        <rich:columnGroup>

         <rich:column>

                 <h:selectManyCheckbox name="check"

            value="#{authGroupManagementUIController.selectedAuthoritiesGroup.authorities}">

            <f:selectItems  itemValue="#{authGroupManagementUIController.allAuthorities}"/>

            <a4j:ajax event="click" listener="#{authGroupManagementUIController.addAuthorityToList(authority.value)}">

            </a4j:ajax>

            </h:selectManyCheckbox>

         </rich:column>

          <rich:column>

        <h:outputText value="#{authList.name}"></h:outputText>

        </rich:column>

        </rich:columnGroup>

        </rich:dataTable>

           <div align="right" style="margin-right : 10px">

        <h:panelGrid id="buttons" columns="2" 

        >

                    <h:commandButton id="save" value="Save" type="submit"

                    action="#{authGroupManagementUIController.saveAuthoritiesGroup}"

                   

                    >

                    

                    </h:commandButton>

                   

               <h:commandButton id="cancel" value="Cancel" 

                    render="inputPanel"

                 >

               

                 </h:commandButton>

               

               </h:panelGrid>

               </div>

            </rich:popupPanel>

      </a4j:outputPanel>

      </h:form>

      </ui:composition>

       

      Why is the popup not showing up.

      Even the showcase example is not working on my localhost.