JSF selectOneMenu not rendering at all - jsf

I'm trying to add a JSF selectOneMenu in a UI fragment using icefaces 1.8 and cannot get it to render no matter what I do. I can get it to render in a normal jspx page but not within a ui fragment.
<ui:fragment 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:ice="http://www.icesoft.com/icefaces/component">
<ice:selectOneMenu id="myselect"
style="width:100px"
value="#{someField}"
rendered="true">
<f:selectItem itemValue="1" itemLabel="1"/>
<f:selectItem itemValue="2" itemLabel="2"/>
<f:selectItem itemValue="3" itemLabel="3"/>
</ice:selectOneMenu>
</ui:fragment>
Am I missing something basic? I am new to JSF. If I pull out the exact same selectOneMenu into a jspx it works as it should but when I include a ui fragment it does not.
Edit for BalusC:
The fragment is used later in a jspx file that is pulled in with
<ui:include src="myfile.jspx">
<ui:param name="someField" value="#{beanName.someField}"
</ui:include>
I am going off of an existing . There is a lot more in the include that all works as expected and I can add other components like outputText into the ui:fragment but it doesn't make any difference. The full fragment is below. I can post the full include from the jspx as well.
<ui:fragment 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:ice="http://www.icesoft.com/icefaces/component">
<ice:panelGrid cellspacing="0" cellpadding="0" columns="3">
<!-- This component is displayed when the form is opened for editing or display mode-->
<ice:panelGroup rendered="#{not beanName.outputOnlyView }">
<!-- This component is displayed when the form is opened for display mode in EDM stage-->
<ice:panelGroup rendered="#{beanName.displayMode}">
<ice:outputText
id="#{fieldId }"
style="#{inlineStyleField}"
value="#{fieldValue}" >
</ice:outputText>
</ice:panelGroup>
<ice:selectOneMenu id="myselect"
style="width:100px"
value="#{someField}"
rendered="#{not beanName.outputOnlyView}">
<f:selectItem itemValue="IntranetID" itemLabel="Intranet ID"/>
<f:selectItem itemValue="Name" itemLabel="Last Name, First Name"/>
<f:selectItem itemValue="KnownAs" itemLabel="Known As"/>
</ice:selectOneMenu>
<!-- This component is displayed when the form is opened for editing mode in Submitter stage-->
<ice:panelGroup rendered="#{!beanName.displayMode}" panelTooltip="#{fieldId}Help">
<ice:panelGrid style="#{inlineStyle}" cellspacing="0" cellpadding="0" columns="3">
<!-- Column 1 the component -->
<ice:selectInputText id="#{fieldId }"
binding="#{feildBinding}"
options="{frequency:0.4}"
rows="20"
width="100"
partialSubmit="true"
immediate="true"
autocomplete="true"
value="#{fieldValue}"
rendered="#{not beanName.outputOnlyView}"
readonly="#{beanName.globalReadOnly }"
listVar="employee"
listValue="#{beanName[employeeSelect].employeeNamePossibilities}"
valueChangeListener="#{beanName[valueChangeListener] }"
textChangeListener="#{beanName[textChangeListener]}">
<f:facet name="selectInputText">
<ice:panelGrid columns="1">
<ice:panelGrid columns="2" columnClasses="searchCol1,searchCol2">
<ice:outputText id="name" value="#{employee.name}"/>
<ice:outputText id="email" value="#{employee.email}"/>
</ice:panelGrid>
<ice:panelGrid columns="3" columnClasses="searchCol4,searchCol3,searchCol5">
<ice:outputText id="function" value="#{employee.function}"/>
<ice:outputText id="subfunction" value="#{employee.subfunction}"/>
<ice:outputText id="stat1" value="#{employee.stat1}"/>
</ice:panelGrid>
</ice:panelGrid>
</f:facet>
</ice:selectInputText>
<!-- Column 2: Error Messages for this component -->
<ice:message style="color:red;" id="#{fieldId}Error" for="#{fieldId}" showDetail="true"/>
<!-- Column 3: HoverHelp if required -->
<ui:include src="../inc-components-pcr/sub-components-pcr/hoverHelpColumnAndTooltip.jspx"/>
</ice:panelGrid>
</ice:panelGroup>
</ice:panelGroup>
</ice:panelGrid>
</ui:fragment>

I was including the template multiple times on the page which was causing multiple instances of the same id causing it to not render at all. Hence the behavior at the end where an initially hidden one was able to show since the initial render would not render any leaving that ID as available. Dumb mistake.

Related

JSF Primefaces p:calendar or p:datePicker is Not showing any calendar field

I am using Jsf primefaces version 8 and trying to show the calendar field in the xhtml page. But inspite all efforts, the popup calendar field is not displaying at all in the page.
My main.xhtml page contains a p:dialog and this dialog includes another xhtml page, dateEdit.xhtml. Inside the second xhtml, I am trying to have the p:datePicker or p:calendar field. But its not working.
Below is the piece of code from my main.xhtml page:
<p:dialog closable="true" visible="false" modal="true" id="dateDialog" widgetVar="dateDialog" resizable="false" showEffect="fade" hideEffect="fade"
header="Date Edit" width="60%" height="50%" style="max-height:100%; overflow:auto; ">
<ui:include src="dateEdit.xhtml" >
</ui:include>
</p:dialog>
Below is the code snippet from the dateEdit.xhtml :
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core" >
<h:head>
<f:facet name="last">
<link type="text/css" rel="stylesheet" href="../jsfStyle.css" media="all"></link>
</f:facet>
</h:head>
<h:body>
<h:form id="formDtId" enctype="multipart/form-data" method="post" >
<p:outputPanel id="editProjectInfo">
<h:panelGrid id="coreGrid" columns="3" style="margin-bottom:10px" cellpadding="7">
<p:outputLabel for="update_Date" value="Demo Date : " />
<p:calendar id="update_Date" value="#{dateManagedBean.demoDate}" mode="popup" navigator="true" pattern="yyyy-MM-dd" style="font-size:8pt;" showOn="button" >
<f:convertDateTime type="date" pattern="yyyy-MM-dd" for="update_Date"></f:convertDateTime>
</p:calendar>
</h:panelGrid>
</p:outputPanel>
</h:form>
</h:body>
</html>
But if I click on the button icon, no calendar is getting displayed. Nothing is happening.
I tried with the below code also, instead of p:calendar, but that also didn't work :
<p:datePicker id="update_Date" value="#{dateManagedBean.demoDate}" pattern="MM-dd-yyyy" showIcon="true" />
Kindly help to resolve this issue. Thanks.

Conditionally including a Facelet file via <ui:include>

I have 2 Facelets files (index.xhtml and report.xhtml). I use the RichFaces <ui:include src="report.xhtml"/> to load the report into the index. Works fine.
But when I try to only show report on certain conditions, I fail! What does not work is this:
<ui:include src="report.xhtml" rendered="#{indexService.contentName == 'report'}"/>.
The rendered attribute of ui:include does not seem to work.
How can I load the report.xhtml into the index.xhtml on certain conditions? Where is the error in my code?
Edit:
Half of it works now. Changing the Facelet file works with conditions. But the functionality of the loaded Facelet does not work properly. Why is that? Where is the problem in the code?
Based on the suggestions I now have this:
<h:form>
<h:panelGrid>
<a4j:commandLink value="Home" render="contentpanel" action="#{indexService.setContentName('home')}"/>
<a4j:commandLink value="Report" render="contentpanel" action="#{indexService.setContentName('report')}"/>
</h:panelGrid>
</h:form>
<a4j:outputPanel id="contentpanel">
<ui:fragment rendered="#{indexService.contentName eq 'report'}">
<ui:include src="report.xhtml" />
</ui:fragment>
</a4j:outputPanel>
Edit 2:
This is my report Facelet. If I use without any condition the functionality of the report Facelet works perfectly, but if I load it using the condition I posted in Edit 1, then the buttons of <rich:panelMenuItem .../> don't work anymore and <h:outputText escape="false" value="#{reportService.content}"/> does not load the content. Any idea why?
Edit 3:
Changed the <rich:panel header="Report">...</rich:panel>, but behaviour still unchanged.
<!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:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<ui:composition>
<h:outputStylesheet>
.placesmenu {
width: 200px;
vertical-align: top;
}
.contentplace {
vertical-align: top;
}
</h:outputStylesheet>
<h:panelGrid columns="2" width="100%" columnClasses="placesmenu, contentplace">
<rich:panel header="Places">
<h:form>
<rich:panelMenu style="width: 170px">
<a4j:repeat value="#{reportService.menuItems}" var="menuItem" id="repeat_layer1">
<rich:panelMenuGroup label="#{menuItem.label}">
<a4j:repeat value="#{menuItem.subMenuItemList}" var="subMenuItem" id="repeat_layer2">
<rich:panelMenuItem label="#{subMenuItem.label}" render="reportpanel" onbeforedomupdate="#{reportService.setId(subMenuItem.id)}"/>
</a4j:repeat>
</rich:panelMenuGroup>
</a4j:repeat>
</rich:panelMenu>
</h:form>
</rich:panel>
<rich:panel header="Report">
<h:outputText escape="false" value="#{reportService.content}" id="reportpanel"/>
</rich:panel>
</h:panelGrid>
</ui:composition>
</html>
try to surround your ui:include tag with ui:fragment as follows :-
<ui:fragment rendered="#{indexService.contentName eq 'report'}">
<ui:include src="report.xhtml" />
</ui:fragment>

JSF datatable, tomahawk radio

I'm attempting to use a t:radio in my rich:datatable but it's always complaining about the fact that it can't find the component. I did some googling and I have to declare the full name, but I actually think I'm doing that.
Anyone can point me what I'm doing wrong? The code (I'm not going to give a minified version because I'm guessing it's going wrong with the compositions):
letterDetailTemplate.xhtml:
<h:form id="generateLetterForm">
<ui:include src="addStandardLetterMain.xhtml" />
<ui:include src="addStandardLetterText.xhtml" />
<ui:include src="buttons.xhtml" />
</h:form>
addStandardLetterText.xhtml (the radio button is over here, in the slrDataTable):
<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:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:e="http://minfin.regondes2/entity"
xmlns:ccffdecorate="http://java.sun.com/jsf/composite/ccffdecorate"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:l="http://minfin.regondes2/layout"
xmlns:o="http://omnifaces.org/ui"
xmlns:t="http://myfaces.apache.org/tomahawk">
<ui:param name="entityBB" value="#{letterBB}" />
<ui:param name="type" value="Dossier.Letter" />
<l:screenzone id="addStandardLetterTextPanel"
title="#{AppMessages[type.concat('.addStandardLetterText.title')]}">
<h:outputStylesheet name="letterText.css" library="stylesheets" />
<h:outputScript name="letter.js" library="scripts" />
<a4j:region>
<a4j:outputPanel id="letterTextPanel">
<h:inputTextarea id="letterText" name="letterText"
value="#{entityBB.entity.text}" styleClass="letterText" />
<script type="text/javascript">
language: '#{screen.locale.language}'
CKEDITOR.replace( 'generateLetterForm:letterTex', {
});
</script>
</a4j:outputPanel>
<h:panelGroup styleClass="rButtonPanelAlignLeft" layout="block"
rendered="#{dossierContextBB.dossierContext == 'EDIT'}">
<a4j:commandButton
value="#{AppMessages[type.concat('.add.region')]}"
actionListener="#{entityBB.findAvailableRegionStandardLetters()}"
render="slrPopupFormPanel" limitRender="true" status="ajaxStatus"
onclick="LETTER.CKUpdate()"
oncomplete="#{rich:component('addStandardLetterRegion')}.show();" />
</h:panelGroup>
</a4j:region>
<rich:popupPanel id="addStandardLetterRegion" modal="true"
onmaskclick="#{rich:component('addStandardLetterRegion')}.hide()"
autosized="true">
<f:facet name="header">
<h:outputText
value="#{AppMessages['Dossier.Letter.StandardLetter.region.popup.title']}" />
        </f:facet>
<f:facet name="controls">
<h:outputLink value="#"
onclick="#{rich:component('addStandardLetterCentrum')}.hide(); return false;">
X
</h:outputLink>
</f:facet>
<a4j:outputPanel id="slrPopupFormPanel">
<t:selectOneRadio id="slrOption"
value="#{standardLetterBB.selected}" layout="spread"
converter="#{standardLetterBB.converter}">
<f:selectItems value="#{entityBB.availableStandardLetterText}"
var="standardLetter" itemLabel="" itemValue="#{standardLetter}" />
</t:selectOneRadio>
<rich:dataTable id="slrDataTable"
value="#{entityBB.availableStandardLetterText}"
var="standardLetter" noDataLabel="No standard letters found"
rowKeyVar="index">
<rich:column headerClass="ListTitle">
<t:radio for="generateLetterForm:slrDataTable:slrOption" index="#{index}" />
</rich:column>
<e:column entity="#{standardLetter.dossierType}" type="#{type}"
property="type" />
<e:column entity="#{standardLetter}" type="#{type}"
property="numbering" />
<e:columnTranslatable entity="#{standardLetter}" type="#{type}"
property="text" />
</rich:dataTable>
</a4j:outputPanel>
<div class="rButtonPanel">
<h:commandButton value="#{AppMessages['general.action.add']}">
<a4j:ajax event="click" execute="generateLetterForm"
listener="#{entityBB.addMotivationToReport}"
oncomplete="#{rich:component('addStandardLetterRegion')}.hide()"
render="reportMotivationTextPanel" limitRender="true" />
</h:commandButton>
<a4j:commandButton value="#{AppMessages['general.action.cancel']}"
onclick="#{rich:component('addStandardLetterRegion')}.hide()"
limitRender="true" immediate="true" bypassUpdates="true" />
</div>
</rich:popupPanel>
</l:screenzone>
Note that this view works and renders and displays the data from the backingbean when I remove the t:radio.
The errormessage I'm getting is:
SEVERE: java.lang.IllegalStateException: Could not find component 'generateLetterForm:slrDataTable:slrOption' (calling findComponent on component 'generateLetterForm:slrDataTable:0:j_idt258')
javax.faces.FacesException: java.lang.IllegalStateException: Could not find component 'generateLetterForm:slrDataTable:slrOption' (calling findComponent on component 'generateLetterForm:slrDataTable:0:j_idt258')
Change for="generateLetterForm:slrDataTable:slrOption" to for=":generateLetterForm:slrOption" and specify id for your t:radio in datatable also. Don't forget the ":" before generateLetterForm.

Unable to find facet named 'header' in parent composite component

I have implemented a composite component in JSF using primefaces.
<ui:component ...>
<cc:interface>
<cc:facet name="header"/> ...
<cc:interface>
<cc:implementation>
<p:dataTable>
<f:facet name="header">
<c:choose>
<c:when test="#{empty cc.attrs.metadata.headerText}">
<cc:insertFacet name="header" required="true"/>
</c:when>
<c:otherwise>
#{cc.attrs.headerText}
</c:otherwise>
</c:choose>
</f:facet> ...
</dataTable>
</cc:implementation>
When I use it in a normal page it works fine as expected rendering the datatable.
<ui:composition>
<nav:dataTable/>
<f:facet name="header">
<h:outputText value="headerText" />
</f:facet>
</ui:composition>
But when I use it inside a dialog which uses the above composite component, it throws
component.xhtml #28,54
Unable to find facet named 'header' in parent
composite component with id 'j_idt129'
I am making a ajax call to invoke this dialog on click of a link. The dialog comes in different shape and throwing this error in console. Has anyone faced it ? Any help is really appreciable.
cc:insertFacet inserts the whole f:facet tag, so you shouldn't wrap it into another f:facet tag within the composite implementation. As you are writing a custom p:dataTable I think it's easier to overwrite the already existing header facelet as an interface declaration and conditionally render it using JSTL utilities:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:composite="http://java.sun.com/jsf/composite"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:body>
<composite:interface>
<composite:facet name="header" />
<composite:attribute name="title" />
</composite:interface>
<composite:implementation>
<p:dataTable>
<!-- If the facet is given at parent, insert it.
Otherwise, provide the title given by the attribute -->
<c:choose>
<c:when test="#{not empty cc.facets.header}">
<composite:insertFacet name="header" />
</c:when>
<c:otherwise>
<f:facet name="header">
#{cc.attrs.title}
</f:facet>
</c:otherwise>
</c:choose>
<p:column headerText="column" />
</p:dataTable>
</composite:implementation>
</h:body>
</html>
Using it as:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:comp="http://java.sun.com/jsf/composite/comp">
<f:view>
<h:head />
<h:body>
<h:form>
<comp:myTable title="header">
<f:facet name="header">
<h:outputText value="text" />
</f:facet>
</comp:myTable>
<comp:myTable title="Custom header" />
<p:commandButton type="button" onclick="dialog.show()"
value="show in dialog" />
<p:dialog widgetVar="dialog">
<comp:myTable title="header">
<f:facet name="header">
<h:outputText value="text" />
</f:facet>
</comp:myTable>
</p:dialog>
</h:form>
</h:body>
</f:view>
</html>

Rerendring a component inside popupPanel fails

I have popupPanel with a simple form (for search) and a dataTable (for search results). I try to Rerender the dataTable after submitting the form and populating the search results which fails. Here is the source code
<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:rich="http://richfaces.org/rich"
xmlns:rd2="http://www.logica.com/raindance/webcomp"
xmlns:a4j="http://richfaces.org/a4j" template="/layout/template.xhtml">
<ui:define name="head">
</ui:define>
<ui:define name="body" >
.......................................
<rich:popupPanel id="ruleSearchPanel" width="600" lenght="400" autosized="true">
<f:facet name="header">
<h:panelGroup id="modelPanelHeader">
<h:outputText styleClass="modalpanel-header"
value="Search and select a rule set"></h:outputText>
</h:panelGroup>
</f:facet>
<h:form id="searchForm">
<h:panelGrid columns="2" styleClass="center" width="100%">
<h:inputText id="searchForKey" value="#{authRuleRegisterManager.rulSetSearchCriteria}"/>
<a4j:commandButton id="SearchRuleSets" styleClass="plain-btn fright" reRender="ruleSearchPanel"
value="#{messages.search}" type="submit" action="#{authRuleRegisterManager.searchAuthRulesMap(authRuleRegisterManager.rulSetSearchCriteria)}"
/>
</h:panelGrid>
<rich:extendedDataTable id="resultRuleSets"
value="#{authRuleRegisterManager.searchResultsForAuthRuleSets}" selectedClass="active-row"
rows="#{systemSettingsAction.systemSettings.paginationRows.value}"
var="ruleSet"
rowClasses="odd-row-selectable,even-row-selectable"
selectionMode="single">
<rich:column label="ruleset name"
headerClass="left"
styleClass="left" width="70">
<f:facet name="header">
<h:outputText value="name" styleClass="right" />
</f:facet>
<h:outputText value="#{ruleSet.description}" />
</rich:column>
</rich:extendedDataTable>
</h:form>
</rich:popupPanel>
</ui:define>
</ui:composition>
why I cannot rerender my datatable , do I miss something here?
any help will be appreciated.
There is no reRender attribute for <a4j:commandButton> for the version you are using. You can check the tag reference below
a4j:commandButton.
Based on the code I'm seeing (ui:composition not taken into account), if you want to update the dataTable simply change
reRender="ruleSearchPanel"
to
render ="searchForm:resultRuleSets"
If you are confused about determining ids check the link below
How can I know the id of a JSF component so I can use in Javascript
Note: Some of the attributes that you are using are not defined in some of the components that you are using. For example
lenght for rich:popupPanel
selectedClass for rich:extendedDataTable
label for rich:column

Resources