<f:ajax> doesn't update model values on second run? - jsf

I have the following in a JSF 2.0 page:
<rich:column styleClass="tbl-weight" id="weight">
<f:facet name="header">
<h:outputText value="Weight" />
</f:facet>
<h:outputLabel value="lbs" for="lbs" />
<h:inputText size="3" id="lbs" label="lbs"
validatorMessage="Lbs must be from 0 to 999"
value="#{weighFamilyBacking.weightDecoratorMap[child].lbs}">
<f:validateLongRange minimum="0" maximum="999" />
<f:ajax event="change" render="#form" immediate="true"/>
</h:inputText>
<h:outputLabel value="oz" for="oz" />
<h:inputText size="3" id="oz" label="oz"
validatorMessage="Oz must be from 1 to 15"
value="#{weighFamilyBacking.weightDecoratorMap[child].oz}">
<f:validateLongRange minimum="0" maximum="15" />
<f:ajax event="change" render="currentPayoutOutput" />
</h:inputText>
<h:message styleClass="error" for="lbs" />
<h:message styleClass="error" for="oz" />
</rich:column>
<rich:column styleClass="tbl-payout" id="currentPayout">
<f:facet name="header">
<h:outputText id="payout" value="Payout" />
</f:facet>
<h:outputText id="currentPayoutOutput"
value="#{weighFamilyBacking.weightDecoratorMap[child].payout}" />
</rich:column>
When looking at this the f:ajax on the "lbs" and "oz" inputs should update set their values and then cause the currentPayoutOutput to render. This works fine only on the first change to the input field.
This is the same results if I use #form or if I use the currentPayoutOutput. Using a phase listener I see it jump from processValidations right to renderResponse. None of the validator messages are showing up.

The problem ended up being the following:
<f:metadata>
<f:viewParam name="familyId" value="#{weighFamilyBacking.familyId}" required="true"></f:viewParam>
<f:event type="preRenderView"
listener="#{weighFamilyBacking.loadFamily}" />
</f:metadata>
This page takes a familyId as a parameter and it was specified as required. Once I removed this things worked as expected. I assume that since the parameter was there initially it worked the first time. Then on subsequent posts the familyId parameter was no longer there (since it wasn't a hidden form field) and therefor I was jumping from validation right to render phase since the validation of the required "viewParam" was failing.

Related

Omnifaces validateMultiple not triggered in combination with single field validator

I have a loop for constructing 12 input fields:
<h:panelGroup id="panel">
<c:forEach id="iter" items="#{of:createIntegerArray(0,12)}" var="dVar" varStatus="dLoop">
<h:inputText id="input#{dLoop.index}" value="#{doc['input'+=dLoop.index]}" process="#form:panel" update="#form:panel" />
</c:forEach>
<o:validateMultiple id="validateFields" components="#{controller.componentsString}" validator="#{dValidator}" />
</h:panelGroup>
This works ok, until I put a standard validator on the input field. Then the #{dValidator} is not triggered.
So this is not triggering the validator in o:validateMultiple:
<h:panelGroup id="panel">
<c:forEach id="iter" items="#{of:createIntegerArray(0,12)}" var="dVar" varStatus="dLoop">
<h:inputText id="input#{dLoop.index}" value="#{doc['input'+=dLoop.index]}" process="#form:panel" update="#form:panel">
<o:validator validatorId="javax.faces.Length" minimum="5" />
</h:inputText>
</c:forEach>
<o:validateMultiple id="validateFields" components="#{controller.componentsString}" validator="#{dValidator}" />
</h:panelGroup>
Is this a bug in the library? Is there a workaround?
Thanks.

a4j:commandButton doesn't render the element

I've got a JSF page with <rich:tabPanel> which contains 4 tabs.
On the 4th tab I'm trying to use <a4j:commandButton> to execute the action and render resulTable.
Here is the shorten example
<rich:tab header="Journal">
<h:form id="filterForm">
<a4j:jsFunction name="submitByEnter"
action="#{smsLogList.refresh}" render="smsTable" />
<s:div id="divSearch">
<rich:collapsiblePanel header="#{messages['search']}"
switchType="client">
<h:panelGrid column="1">
<s:decorate template="/layout/edit.xhtml">
<ui:define name="label">Package number</ui:define>
<h:inputText id="packNum" style="width:200px"
value="#{smsLogList.packNum}">
<a4j:ajax event="keyup" listener="#{smsLogList.refresh}"
ignoreDupResponses="true" requestDelay="1500"
render="smsTable" />
</h:inputText>
</s:decorate>
<!---some other search elements-->
<s:div styleClass="actionButtons">
<a4j:commandButton id="search" value="#{messages['search']}"
render="smsTable" action="#{smsLogList.go}" />
<a4j:commandButton id="reset" value="#{messages['clear']}"
onclick="document.getElementById('filterForm').reset();"
action="#{smsLogList.clear}" render="divSearch,smsTable" />
</s:div>
</h:panelGrid>
</rich:collapsiblePanel>
</s:div>
<!--- results table-->
<h:panelGrid id="smsTable">
<s:div>
<rich:dataTable value="#{smsLogList.resultList}" var="sms"
id="table" rendered="#{not empty smsLogList.resultList}">
<rich:column>
<f:facet name="header">Type</f:facet>
<h:outputText value="#{sms.smsType}" />
</rich:column>
<!---- some other columns-->
</rich:dataTable>
<rich:dataScroller for="table" />
</s:div>
</h:panelGrid>
</h:form>
</rich:tab>
So, when I'm clicking on the <a4j:commandButton> - nothing happens, but if I'm switching to the other tab and back - the result is as necessary.
I tried to change a4j to <h:commandButton>, but after it's pressed the page switches to the first tab.
Is any solution how to work this out?
The solution is quite simple.
I used <h:form> inside other <h:form>. It will not work anyway. When I remove internal - the jsf works smooth and as it should.

Richfaces: a4j:status inside rich:list/rich:dataTable fires in all row

Issue happening when migrate richface3 to richface4:
here I want to put status indicator(a4j:status) to indicate change of each row inside rich:list/rich:dataTable.
but now a4j:status in all row is fired when one of the row change(keyup).
it works before in richface3, but not in richface4 anybody can help?
<rich:list value="#{identity.user.roleList}" var="_role">
<a4j:region>
<h:inputText value="#{bean.text}">
<a4j:ajax status="y" event="keyup" />
</h:inputText>
<a4j:status id="x" name="y">
<f:facet name="start">
<h:graphicImage name="img/load_small.gif" />
</f:facet>
</a4j:status>
</a4j:region>
</rich:list>
The <a4j:status> is referenced by name. Since all your statuses have the same name all of them are being called. You need to give each one a unique name, like this:
<rich:list value="#{identity.user.roleList}" var="_role" rowKeyVar="rk">
<a4j:region>
<h:inputText value="#{bean.text}">
<a4j:ajax status="y#{rk}" event="keyup" />
</h:inputText>
<a4j:status id="x" name="y#{rk}">
<f:facet name="start">
<h:graphicImage name="img/load_small.gif" />
</f:facet>
</a4j:status>
</a4j:region>
</rich:list>

How to submit values in a pop-up panel?

I have bean struggling to understand how to use the rich:popupPanel component in the right way. There are (at least not that I could find) few post about how to use the rich:popupPanel and how to submit values from it.
To make matter worse the panel seams to add (when checking the html) a hard coded "_content" to its component id name (to the div generated). I have tried to use aj4:region tag to partial render the complete form. But that didn't seamed to work, cause nothing where posted to managed bean. So now I have one option left, where the panel has its own form, outside the main one on the page.
I can see that the evaluation of the form (popup) values is happening, but not the execution of the bean function that persist the values (I see the POST request of the command button). The only reason I can think of at the moment, is that the pop-up panel use another bean to persist the values that the main form on the page (both of them are session scoped).
I am thinking of omit the pop-up panel all together, since it seams so hard to make this work. Maybe its a well know secret, since it so few post about it. It behaves the same if if use componentController or only a a4j:commanLink.
How is it possible to submit values from a rich:popupPanel and invoke a backing bean function to persist the pop-up form values ?
Appreciate if someone can shed some light on this, greetings Chris.
I use Richfaces 4.0-final on Glassfish 3.1
<h:form id="main_form">
<!-- Command for popup -->
<a4j:commandLink actionListener="#{userController.prepareCreateSysRequest}" oncomplete="#{rich:component('popup_sys_user_req_form:popup_sys_user_req')}.show(); return false;"
execute="#this" value="Request New Sector/Category" />
...
<a4j:commandButton action="#{projectController.Create}" ...>
</h:form>
<h:form id="popup_sys_user_req_form">
<rich:popupPanel id="popup_sys_user_req" modal="true" autosized="true" resizeable="false">
<f:facet name="header">
<h:outputText value="New Project Request" />
</f:facet>
<f:facet name="controls">
<h:outputLink value="#"
onclick="#{rich:component('popup_sys_user_req')}.hide(); return false;">
X
</h:outputLink>
</f:facet>
<h:panelGrid columns="2">
<h:outputLabel value="Request New:" />
<h:selectOneMenu id="sys_req_type" value="#{userController.selectedSysRequestType}" required="true" requiredMessage="Request Type is required" title="Request Type">
<f:selectItems value="#{userController.getSysRequestTypeItems()}">
</f:selectItems>
</h:selectOneMenu>
<h:outputLabel value="Description:" />
<h:inputTextarea id="user_req_desc" value="#{userController.selectedSysUserRequest.description}" required="true" requiredMessage="Decription is missing" />
</h:panelGrid>
<a4j:commandButton action="#{userController.CreateSysUserRequest}" onclick="#{rich:component('popup_sys_user_req')}.hide(); return false;" execute="#form" render="popup_sys_user_req_form" value="Send Request" />
</rich:popupPanel>
</h:form>
For what I have done I used to have the issue to got to submit twice only the first time.
To fix it the form got to be outside the popupPane. And also that the popupPanel should have the attibute domElementAttachment="form".
Example.
<h:form>
<rich:popupPanel id="shipmentItemUpdateDialog"
autosized="true"
domElementAttachment="form">
<f:facet name="header">
<h:panelGroup>
<h:outputText value="#{shipmentBundle.shipmentItemDetailsHeader}" />
</h:panelGroup>
</f:facet>
<f:facet name="controls">
<h:commandLink>
<h:graphicImage value="/core/images/modal/close.png"/>
<rich:componentControl target="shipmentItemUpdateDialog" operation="hide" />
</h:commandLink>
</f:facet>
<h:outputText for="shipmentItemName"
value="#{coreBundle.requiredChar} #{shipmentBundle.shipmentItemName}"
/>
<h:inputText id="shipmentItemName"
disabled ="false"
required ="true"
value="#{shipmentItemController.shipmentItemUI.value.name}"
label="#{shipmentBundle.shipmentItemName}"
size="40" >
</h:inputText>
<h:outputText for="shipmentItemCode"
value="#{coreBundle.requiredChar} #{shipmentBundle.shipmentItemCode}"
/>
<h:inputText id="shipmentItemCode"
disabled ="false"
required ="true"
value="#{shipmentItemController.shipmentItemUI.value.code}"
label="#{shipmentBundle.shipmentItemCode}"
size="40" >
</h:inputText>
<h:outputText value="#{coreBundle.requiredChar} #{shipmentBundle.shipmentItemAmount}"
/>
<h:inputText id="shipmentItemAmount"
disabled ="false"
required ="true"
value="#{shipmentItemController.shipmentItemUI.value.amount}"
label="#{shipmentBundle.shipmentItemAmount}"
size="4" >
<f:validateLongRange minimum="1"/>
</h:inputText>
<h:outputText value="#{coreBundle.requiredChar} #{shipmentBundle.shipmentItemNeedsCooling}"
/>
<h:selectBooleanCheckbox id="shipmentItemNeedsCooling"
disabled ="false"
required ="true"
value="#{shipmentItemController.shipmentItemUI.value.needsCooling}"
label="#{shipmentBundle.shipmentItemNeedsCooling}"
/>
<h:outputText for="shipmentItemDetails"
value="#{shipmentBundle.shipmentItemDetails}"
/>
<h:inputTextarea id="shipmentItemDetails"
disabled ="false"
required ="true"
value="#{shipmentItemController.shipmentItemUI.value.details}"
label="#{shipmentBundle.shipmentItemDetails}"
cols="38"
rows="5"
/>
</h:panelGrid>
<h:panelGrid columns="1" dir="LTR">
<h:panelGrid columns="2" dir="LTR">
<a4j:commandButton value="#{coreBundle.acceptButton}"
action="#{shipmentItemController.onUpdate()}"
render="shipmentItemsTable">
</a4j:commandButton>
<h:commandLink value="#{coreBundle.closeLink}"
immediate="true">
<rich:componentControl target="shipmentItemUpdateDialog" operation="hide" />
</h:commandLink>
</h:panelGrid>
<h:outputText value="#{coreBundle.requiredText}"/>
</h:panelGrid>
</rich:popupPanel>
</h:form>
I hope this helps.
I think you got it right.. think of the pop-up as a regular page. To submit and close the pop-up, do something like this:
<a4j:commandButton value="Save" onclick="#{rich:component('panelId}.hide();" render="..."/>
Hope this helps..

Seam: Trouble updating data in h:inputText in a row of rich:dataTable

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

Resources