I'm trying to fill my input with a value from a parametrized method as I can't access to this value directly with a getter.
<c:forEach items="#{operationBean.tableFields}" var="tableField" varStatus="status">
<rich:column>
<f:facet name="header">
<h:panelGroup>
<h:outputText value="#{operationBean.findLabel(tableField)}"/>
<h:inputText value="#{operationBean.filters[tableField]}" layout="block">
<a4j:ajax event="keyup" render="table" execute="#table"/>
</h:inputText>
</h:panelGroup>
</f:facet>
<c:choose>
<c:when test="#{operationBean.editableColumn(tableField)}">
<rich:inplaceInput value="#{operationBean.findOperationFieldValue(operation, tableField)}"
valueChangeListener="#{operationBean.changeOperationFieldValue}"
saveOnBlur="false">
<f:attribute name="tableField" value="#{tableField}"/>
<f:attribute name="operation" value="#{operation}"/>
<a4j:ajax execute="#this"/>
</rich:inplaceInput>
</c:when>
<c:otherwise>
<h:outputText value="#{operationBean.findOperationFieldValue(operation, tableField)}"/>
</c:otherwise>
</c:choose>
</rich:column>
</c:forEach>
Obviously, JSF tries to call a setter for the rich:inplaceInput, cannot find it, and throws
javax.el.PropertyNotWritableException: /faces/operations/table.xhtml #29,56 value="#{operationBean.findOperationFieldValue(operation, tableField)}": Illegal Syntax for Set Operation
I don't need this attempted call to a setter, as the valueChangeListenerdoes what I need.
I could create my own component and override UIInput.updateModel() but that would be a pain.
Related
I have a collection of items which each have a min, likely, and max value. There are validators to ensure the maximum is greater than the minimum etc. The validators use bindings so they can compare all three values the user has entered. Originally they were in a ui:repeat, but that was causing trouble with a dropdown and I found switching to a c:forEach fixed it. Unfortunately, it's also messed up the bindings. I'm hoping there's a way to fix them without going back to the ui:repeat.
Is it possible to have a binding in a c:forEach? Is there some way to add an id or a varStatus index to the binding so it isn't the same for every item in the list? e.g. in the example below I've tried things like
<h:inputText id="impactMin_#{impact.id}" binding="#{impactMin_#{impact.id}}">
<h:inputText id="impactMin_#{impact.id}" binding="#{impactMin}_#{impact.id}">
but unsurprisingly, those don't work. If anyone knows a sensible way of doing this, I'd be very grateful to hear it.
This is a simplified version of the code:
<c:forEach id="impacts" var="impact" items="#{mybean.impacts}" varStatus="i">
<h:panelGroup layout="block" id="impactContainer_#{impact.id}">
<h:outputText value="#{impact.score_impact_type_idInterface.score_impact_type_name}"/>
<h:panelGroup layout="block" class="row form-group" id="impactAssessment_#{impact.id}">
<h:panelGroup layout="block">
<h:inputText id="impactMin" value="#{impact.current_impact_min}" binding="#{impactMin}" label="Minimum">
<f:attribute name="impactMl" value="#{impactMl}"/>
<f:attribute name="impactMax" value="#{impactMax}"/>
<f:convertNumber locale="#{loginInfo.realLocale}" minIntegerDigits="1" maxFractionDigits="2" />
<f:validator binding="#{impactMinValidator}"/>
</h:inputText>
</h:panelGroup>
<h:panelGroup layout="block">
<h:inputText id="impactMl" value="#{impact.current_impact_ml}" binding="#{impactMl}" label="Most likely">
<f:attribute name="impactMin" value="#{impactMin}"/>
<f:attribute name="impactMax" value="#{impactMax}"/>
<f:convertNumber locale="#{loginInfo.realLocale}" minIntegerDigits="1" maxFractionDigits="2" />
<f:validator binding="#{impactLikelyValidator}"/>
</h:inputText>
</h:panelGroup>
<h:panelGroup layout="block">
<h:inputText id="impactMax" value="#{impact.current_impact_max}" binding="#{impactMax}" label="Maximum">
<f:attribute name="impactMin" value="#{impactMin}"/>
<f:attribute name="impactMl" value="#{impactMl}"/>
<f:convertNumber locale="#{loginInfo.realLocale}" minIntegerDigits="1" maxFractionDigits="2" />
<f:validator binding="#{impactMaxValidator}"/>
</h:inputText>
</h:panelGroup>
<div class="col-sm-12">
<h:message for="impactMin"/>
<h:message for="impactMl"/>
<h:message for="impactMax"/>
</div>
</h:panelGroup>
</h:panelGroup>
</c:forEach>
While trying to get a better understanding of bindings in general, I found this answer JSF 2 composites and binding for validation . While not quite the same thing, I found it could be adapted to a c:forEach like this:
<c:forEach id="impacts" var="impact" items="#{mybean.impacts}" varStatus="i">
<h:panelGroup layout="block" id="impactContainer_#{impact.id}">
<h:outputText value="#{impact.score_impact_type_idInterface.score_impact_type_name}"/>
<h:panelGroup layout="block" class="row form-group" id="impactAssessment_#{impact.id}">
<ui:param name="impactMin" value="impactMin_#{impact.id}" />
<ui:param name="impactMl" value="impactMl_#{impact.id}" />
<ui:param name="impactMax" value="impactMax_#{impact.id}" />
<h:panelGroup layout="block">
<h:inputText id="impactMin_#{impact.id}" value="#{impact.current_impact_min}" binding="#{requestScope[impactMin]}" label="Minimum">
<f:attribute name="impactMl" value="#{requestScope[impactMl]}"/>
<f:attribute name="impactMax" value="#{requestScope[impactMax]}"/>
<f:convertNumber locale="#{loginInfo.realLocale}" minIntegerDigits="1" maxFractionDigits="2" />
<f:validator binding="#{impactMinValidator}"/>
</h:inputText>
</h:panelGroup>
<h:panelGroup layout="block">
<h:inputText id="impactMl_#{impact.id}" value="#{impact.current_impact_ml}" binding="#{requestScope[impactMl]}" label="Most likely">
<f:attribute name="impactMin" value="#{requestScope[impactMin]}"/>
<f:attribute name="impactMax" value="#{requestScope[impactMax]}"/>
<f:convertNumber locale="#{loginInfo.realLocale}" minIntegerDigits="1" maxFractionDigits="2" />
<f:validator binding="#{impactLikelyValidator}"/>
</h:inputText>
</h:panelGroup>
<h:panelGroup layout="block">
<h:inputText id="impactMax_#{impact.id}" value="#{impact.current_impact_max}" binding="#{requestScope[impactMax]}" label="Maximum">
<f:attribute name="impactMin" value="#{requestScope[impactMin]}"/>
<f:attribute name="impactMl" value="#{requestScope[impactMl]}"/>
<f:convertNumber locale="#{loginInfo.realLocale}" minIntegerDigits="1" maxFractionDigits="2" />
<f:validator binding="#{impactMaxValidator}"/>
</h:inputText>
</h:panelGroup>
<div class="col-sm-12">
<h:message for="impactMin_#{impact.id}"/>
<h:message for="impactMl_#{impact.id}"/>
<h:message for="impactMax_#{impact.id}"/>
</div>
</h:panelGroup>
</h:panelGroup>
</c:forEach>
Note the ui:param bits near the top. That seems to do the trick. Thanks BalusC!
In my crud application I want to select a row and then display that row data in a popup. navigating to another page works and it displays the data. when I try to display it in my popup no values are displayed. I could be wrong but I think the popup opens before the method prepareView is done.
code block:
<h:column>
<f:facet name="header">
<h:outputText value=" "/>
</f:facet>
<h:commandLink id="myLink" value="Action" action="#{timeLoggingDetailController.prepareView}" rendered="#{item.timeLoggingId eq AdminTimeLogging.filteredId}" styleClass="auto-style5">
<rich:componentControl target="popup" operation="show"/>
</h:commandLink>
</h:column>
</h:dataTable>
</h:panelGroup>
</h:form>
<rich:popupPanel id="popup" modal="false" autosized="true" resizeable="false" domElementAttachment="form">
<f:facet name="header">
<h:outputText value="Approval level" />
</f:facet>
<f:facet name="controls">
<h:outputLink value="#" onclick="#{rich:component('popup')}.hide();
return false;">
Close
</h:outputLink>
</f:facet>
<h:form id="submitForm">
<h:panelGrid columns="2">
<h:outputText value="#{bundle.ViewTimeLoggingDetailLabel_date}"/>
<h:outputText value="#{timeLoggingDetailController.selected.date}" title="#{bundle.ViewTimeLoggingDetailTitle_date}">
<f:convertDateTime pattern="MM/dd/yyyy" />
</h:outputText>
<h:outputText value="#{bundle.ViewTimeLoggingDetailLabel_description}"/>
<h:outputText value="#{timeLoggingDetailController.selected.description}" title="#{bundle.ViewTimeLoggingDetailTitle_description}"/>
<h:outputText value="#{bundle.ViewTimeLoggingDetailLabel_normalHours}"/>
<h:outputText value="#{timeLoggingDetailController.selected.normalHours}" title="#{bundle.ViewTimeLoggingDetailTitle_normalHours}"/>
<h:outputText value="#{bundle.ViewTimeLoggingDetailLabel_overtimeHours}"/>
<h:outputText value="#{timeLoggingDetailController.selected.overtimeHours}" title="#{bundle.ViewTimeLoggingDetailTitle_overtimeHours}"/>
<h:outputText value="#{bundle.ViewTimeLoggingDetailLabel_doubleTimeHours}"/>
<h:outputText value="#{timeLoggingDetailController.selected.doubleTimeHours}" title="#{bundle.ViewTimeLoggingDetailTitle_doubleTimeHours}"/>
<h:outputText value="#{bundle.ViewTimeLoggingDetailLabel_approvalLevelsId}"/>
<h:outputText value="#{timeLoggingDetailController.selected.approvalLevelsId}" title="#{bundle.ViewTimeLoggingDetailTitle_approvalLevelsId}"/>
</h:panelGrid>
<br />
<h:panelGrid class="auto-style4">
<h:commandLink action="#{timeLoggingDetailController.update}" value="#{bundle.EditTimeLoggingDetailSaveLink}" onclick="#{rich:component('popup')}.hide();" styleClass="linkbutton"/>
</h:panelGrid>
</h:form>
</rich:popupPanel>
</ui:define>
</ui:composition>
</html>
You may want to use <a4j:commandLink>, it provides oncomplete event which is fired when the action completes.
This should work for you:
<a4j:commandLink id="myLink" value="Action" actionListener="#{timeLoggingDetailController.prepareView}" rendered="#{item.timeLoggingId eq AdminTimeLogging.filteredId}" styleClass="auto-style5">
<rich:componentControl event="complete" target="popup" operation="show"/>
</a4j:commandLink>
as per my requirement I have to create multiple blank datatable in ui on click of a button .
user can continuously add more tables on click .
as per my understanding I can add one datatable and can iterate over collection but how to add more.
<h:commandButton immediate="true" styleClass="search_btn" value="Search" >
<f:ajax listener="#{relationBean.searchRelation}" event="click" />
</h:commandButton>
<h:commandButton immediate="true" value="Add Value">
<f:ajax listener="#{relationBean.addTable}" execute="relationId" event="click" />
</h:commandButton>
<div class="clear"> </div>
<h:dataTable rendered="#{relationBean.flagForDatatable}" value="# {relationBean.elementRelationList}" var="element">
<h:column>
<f:facet name="header"> Relation Type Name</f:facet>
<h:outputText value="#{element.relationType}" />
</h:column>
<h:column>
<f:facet name="header"> Value</f:facet>
<h:inputText value="#{element.relationForm}" />
</h:column>
<h:column>
<f:facet name="header">language</f:facet>
<h:outputText value="#{element.languageCode.languageName}" />
</h:column>
<h:column>
<f:facet name="header"> Delete</f:facet>
<h:commandButton value="Delete" />
</h:column>
</h:dataTable>
You can just use <ui:repeat> to iterate over a collection and render the same JSF component structure multiple times.
<ui:repeat value="#{bean.datatables}" var="datatable">
<h:dataTable value="#{datatable.value}" var="item">
...
</h:dataTable>
</ui:repeat>
In the command button, just add a new item to the collection behind #{bean.datatables}.
Belwo is the applied logic
<h:inputText id="relationId" class="relationship" value="#{relationBean.relationName}" required="true" requiredMessage="Enter relation">
<f:ajax></f:ajax>
</h:inputText> </div>
<h:commandButton styleClass="search_btn" >
<f:ajax listener="#{relationBean.searchRelation}" event="click" render="addBtn" execute="#all"/>
</h:commandButton>
<h:messages id="msgGlobal" globalOnly="true"/>
<h:commandButton id="addBtn" disabled="#{relationBean.showButton}" class="addvalue" value="Add Value">
<f:ajax listener="#{relationBean.addValue}" render="r" event="click" />
</h:commandButton>
<div class="clear"> </div>
<h:panelGroup id="r" >
<c:forEach id="repeat" items="#{relationBean.datatables}" var="">
<h:dataTable id="datatable" value="#{relationBean.languageDTOList}" var="lang">
<h:column>
<f:facet name="header"> Relation Type Name</f:facet>
<h:outputText value="#{relationBean.relationName}" />
</h:column>
<h:column>
<f:facet name="header"> Value</f:facet>
<h:inputText />
</h:column>
<h:column>
<f:facet name="header">language</f:facet>
<h:outputText value="#{lang.languageName}" />
</h:column>
<h:column>
<f:facet name="header"> Delete</f:facet>
<h:commandButton styleClass="remove_icon" value="Delete" >
</h:commandButton>
</h:column>
I've ArrayList Collection carry the values properly , but the problem when i rendered it in h:dataTable tag the rows become all same value like in the picture.
<h:dataTable value="#{contactController.contacts }" var="contact"
rowClasses="oddRow, evenRow" styleClass="contactTable"
headerClass="headerTable" columnClasses="normal,centered"
rendered="#{not empty contactController.contacts }">
<h:column>
<f:facet name="header">
<h:column>
<h:outputText value="Name" />
</h:column>
</f:facet>
<h:outputText
value="#{contactController.contact.firstName }#{ contactController.contact.secondName }" />
</h:column>
<h:column>
<f:facet name="header">
<h:column>
<h:outputText value="Action" />
</h:column>
</f:facet>
<h:panelGrid columns="2">
<h:commandLink value="remove"
action="#{contactController.remove }">
<f:setPropertyActionListener value="#{contact }"
target="#{contactController.selectedContact }" />
</h:commandLink>
<h:commandLink value="edit" action="#{contactController.read}">
<f:setPropertyActionListener value="#{contact }"
target="#{contactController.selectedContact }" />
</h:commandLink>
</h:panelGrid>
</h:column>
</h:dataTable>
Any suggestion? .
I think there are two problems with your code.
First you don't need the bean's name in your columns. Simply use the content of the var attribute (in your case "contact" and not "contactController.contact")
Second: The h:column inside f:facet is not correct. Put the h:outputText directly into f:facet.
Change your first column this way:
<h:column>
<f:facet name="header">
<h:outputText value="Name" />
</f:facet>
<h:outputText value="#{contact.firstName} #{contact.secondName }" />
</h:column>
I'm trying to build an editable table to enter values of a buy order detail. I have a rich:datatable bound to a List, and I dinamically add rows to the table by adding elements to the list. The entity has two fields that must be entered manually so I'm using h:inputTexts to do it, but the values that are entered on those fields are not being saved to the objects in the list. I tried to do this with a rich:inplaceInput too(following the exact instructions on the Exadel Richfaces livedemo), to no avail. This is my code:
<rich:panel>
<f:facet name="header">#{messages.DetalleOrdenCompra}</f:facet>
<h:outputLabel value="#{messages.Codigo}" for="txtCodigo" /> #{' '}
<h:inputText id="txtCodigo">
<rich:suggestionbox id="suggestionBox" for="txtCodigo"
var="consumible" fetchValue="#{consumible.conNombre}"
suggestionAction="#{ordenCompraHome.autoComplete}" minChars="1"
reRender="tablaDetOrdComp" ignoreDupResponses="true"
bypassUpdates="false">
<h:column>
<f:facet name="header">#{messages.Codigo}</f:facet>
<h:outputText value="#{consumible.conNumber}" />
</h:column>
<h:column>
<f:facet name="header">#{messages.Descripcion}</f:facet>
<h:outputText value="#{consumible.conNombre}" />
</h:column>
<a:support event="onselect" immediate="true"
ignoreDupResponses="true" bypassUpdates="false">
<f:setPropertyActionListener value="#{consumible}"
target="#{ordenCompraHome.conActual}" />
</a:support>
</rich:suggestionbox>
</h:inputText>
#{' '}
<!-- Add elements to the list -->
<a:commandButton type="button" value="#{messages.Agregar}"
action="#{ordenCompraHome.anadirSeleccionadoADetalle()}"
reRender="tablaDetOrdComp" immediate="true" />
<!-- Hitting this button after entering any values in the table below shows that the values are never updated -->
<a:commandButton type="button" value="Refrescar tabla"
reRender="tablaDetOrdComp" immediate="true" />
<br />
<br />
<rich:dataTable value="#{ordenCompraHome.detalleOrdenCompra}"
var="detOrdComp" id="tablaDetOrdComp" rowKeyVar="row">
<rich:column width="5%">
<f:facet name="header">
<h:outputText value="#"></h:outputText>
</f:facet>
<h:outputText value="#{row+1}"></h:outputText>
</rich:column>
<!-- ... more columns, just data output -->
<!-- The two following columns are user inputs -- no updates in the underlying list when entering any value, both values are always null -->
<rich:column width="10%">
<f:facet name="header">
<h:outputText value="#{messages.Cantidad}"></h:outputText>
</f:facet>
<s:decorate template="layout/edit-nolabel.xhtml">
<h:inputText value="#{detOrdComp.ordCantidad}" id="txtCantidad" required="true">
<!-- tried with both events, onblur and onviewactivated, first each on on its own, then both together, no results -->
<a:support event="onblur" reRender="columnaMonto" immediate="true"
bypassUpdates="false" ajaxSingle="true" />
<a:support event="onviewactivated" reRender="columnaMonto" immediate="true"
bypassUpdates="false" ajaxSingle="true" />
</h:inputText>
</s:decorate>
</rich:column>
<rich:column width="10%">
<f:facet name="header">
<h:outputText value="#{messages.CostoUnitario}"></h:outputText>
</f:facet>
<s:decorate template="layout/edit-nolabel.xhtml">
<h:inputText value="#{detOrdComp.ordCostoUnitario}"
id="txtCostoUnitario" required="true">
<a:support event="onblur" reRender="columnaMonto"
immediate="true" bypassUpdates="false" ajaxSingle="true" />
<a:support event="onviewactivated" reRender="columnaMonto" immediate="true"
bypassUpdates="false" ajaxSingle="true" />
</h:inputText>
</s:decorate>
</rich:column>
<!-- This column is the result of a multiplication between txtCantidad and txtCostoUnitario -- I don't get anything here since both factors are null (null values have been properly handled so 0.0 is displayed when any of the factors is null) -->
<rich:column id="columnaMonto" width="10%">
<f:facet name="header">
<h:outputText value="#{messages.Monto}"></h:outputText>
</f:facet>
<h:outputText value="#{detOrdComp.ordSubparcial}"></h:outputText>
</rich:column>
</rich:dataTable>
Bean:
// Underlying list. I used just #DataModel, then #DataModel(scope = ScopeType.PAGE), no results
#DataModel(scope = ScopeType.PAGE)
public List<OrdenCompraDetalle> getDetalleOrdenCompra() {
return detalleOrdenCompra;
}
Instead of the s:decorates I was using something like this before (from the Livedemo), but it didn't work, either
<rich:dataTable value="#{dataTableScrollerBean.allCars}" var="car" width="350px" columnClasses=",columns,columns,columns" rows="15" id="table" rowKeyVar="row">
<rich:column>
<f:facet name="header">
<h:outputText value="Price" />
</f:facet>
<rich:inplaceInput layout="block" value="#{car.price}"
id="inplace" required="true" selectOnEdit="true" editEvent="ondblclick">
<a4j:support event="onviewactivated" reRender="table, messages"/>
</rich:inplaceInput>
</rich:column>
What am I missing here? Any help would be appreciated. Thanks in advance.
I think that your problem is the ajaxSingle="true" attribute. This attribute means that, even if all the input elements in the form are submitted, only the input the one that triggered the submit will be processed.
If this is the problem, you can try any of the following (I assume that the a prefix is the common a4j prefix?):
Add the id of the h:inputText, to the processed attribute to <a:support>. This will force the input of the specific row to be processed. For example (not tested):
<h:inputText value="#{detOrdComp.ordCostoUnitario}"
id="txtCostoUnitario" required="true">
<a:support event="onblur" reRender="columnaMonto"
immediate="true" bypassUpdates="false" ajaxSingle="true" processed="txtCostoUnitario" />
<a:support event="onviewactivated" reRender="columnaMonto" immediate="true"
bypassUpdates="false" ajaxSingle="true" processed="txtCostoUnitario"/>
</h:inputText>
Remove the ajaxSingle and instead surround the <h:inputText> in a a4j:region (analogous to ajaxSingle with processed, here all the inputs in the closest/enclosing region are processed):
<a4j:region>
<h:inputText value="#{detOrdComp.ordCostoUnitario}" id="txtCostoUnitario"
required="true">
<a:support event="onblur" reRender="columnaMonto"
immediate="true" bypassUpdates="false" />
<a:support event="onviewactivated" reRender="columnaMonto"
immediate="true" bypassUpdates="false" />
</h:inputText>
</a4j:region>
Remove the ajaxSingle. This will cause all the elements in your form to be processed. Will take more time.
enter code here