rich:popupPanel now showing up
pinks70986 Nov 12, 2013 10:36 PMHi
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 < 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.