Environment:
Jboss 7.1.1.Final JSF 2.2.6 Seam 2.3.1.Final Richfaces 4.5.10.Final
Issue
Richfaces 4 extendeddatatable on render does not hold the value (Resource dropdown in the example listed below).
Steps:
First I choose a value from the Resource dropdown
Then I choose a value form the Result dropdown which triggers the a4j:ajax call
My XHTML structure is as listed below:
<a4j:region id="hraregion">
<rich:extendedDataTable id="hraProcessing"
value="#{maActionList}" var="mpa" selectionMode="single">
<h:column width="200px">
<f:facet name="header">
<h:outputText value="Resource" />
</f:facet>
<h:selectOneMenu id="staffResources" value="{mpa.staffResources}" label="Resource"
<s:selectItems value="#{mpa.validStaffResources}" var="sr" label="#{sr.firstName} #{sr.lastName}"/>
<s:convertEntity />
</h:selectOneMenu>
</h:column>
<rich:column width="140px">
<f:facet name="header">
<h:outputText value="Result" />
</f:facet>
<h:selectOneMenu id="results" value="#{mpa.actionResults}">
<a4j:ajax execute="region" listener="#{maintainAssessment.performNextAction(mpa, 'mpa')}" render="hraProcessing, actionMessage" />
<s:selectItems value="#{mpa.validActionResults}" var="ar" label="#{ar.name}" noSelectionLabel="Select One" />
<s:convertEntity />
</h:selectOneMenu>
</rich:column>
</rich:extendedDataTable>
</a4j:region>
Note:
We are migrating from Richfaces 3.3 to 4.5 and this functionality was working fine in Richfaces 3.3 but ofcourse the entire page was refreshed in 3.3 as opposed to the partial refresh in Richfaces 4.5
Can someone please point me in the right direction on how to retain the selected value after the a4j render happens?
I found a way to accomplish this by updating the backing bean immediately using f:ajax after the value changes in the Resource dropdown. Hope this helps someone who faces the same issue.
<h:selectOneMenu id="staffResources" value="#{mpa.staffResources}"
label="Resource" styleClass="LFloat">
<s:selectItems value="#{mpa.validStaffResources}" var="sr"
label="#{sr.firstName} #{sr.lastName}"/>
<s:convertEntity />
<f:ajax event="valueChange" execute="#this" render="#none"/>
</h:selectOneMenu>
Related
The following code in my .xhtml works fine:
<h:commandButton id="btnConsultar"
action="#cadastrarProponenteBean.consultarCnpj}"
value="#{messages.tx_consultar}"
styleClass="btnAcao" />
But, when I add a4j:support:
<h:commandButton id="btnConsultar"
action="#{cadastrarProponenteBean.consultarCnpj}"
value="#{messages.tx_consultar}"
styleClass="btnAcao">
<a4j:support event="onclick" />
</h:commandButton>
the application breaks, I get strange errors, and my validation messages('getFacesContext().addMessage') are not shown.
Since I'm using a4j:support just to show a loading gif when user clicks, any advice on how to fix this problem?
I'm using JSF and RichFaces.
PS: already tried a4j:commandButton instead of h:commandButton but same problems...
You should use <a4j:status> similar to:
<a4j:status id="ajaxstatus" rendered="true">
<f:facet name="start">
<h:panelGroup>
<h:graphicImage value="/images/loading.gif" />
</h:panelGroup>
</f:facet>
<f:facet name="stop">
</f:facet>
</a4j:status>
I have it in template. Loading image is displayed during any long action.
I have the maven dependency for omnifaces for version 1.11 (as my target is JDK 1.6). Richfaces 4.5.6 final, myfaces 2.2.8. And, against a viewscoped bean I have got this xhtml:
<ui:define name="content">
<f:loadBundle basename="au.com.erb.facility.ui.facility"
var="property" />
<o:highlight styleClass="error" />
<h:panelGrid columns="2">
<rich:validator event="change">
<o:outputLabel value="#{property.absClientNumber}" for="input1" />
<h:inputText id="input1"
value="#{facilityBean.facilityForEdit.alternateKey.absClientNumber}"
label="ABS Client Number" />
<o:outputLabel value="#{property.facilityid}" />
<h:inputText
value="#{facilityBean.facilityForEdit.alternateKey.facilityId}"
label="Facility Id" />
<h:outputLabel value="#{property.rfsAccountGroup}" />
<h:inputText value="#{facilityBean.facilityForEdit.rfsAccountGroup}"
label="RFS Account Group" />
<h:outputLabel value="#{property.rfsAcctCustomerNumber}" />
<h:inputText
value="#{facilityBean.facilityForEdit.rfsAcctCustomerNumber}"
label="RFS Account Customer Number" />
<h:outputLabel value="#{property.rfsAcctLedger}" />
<h:inputText value="#{facilityBean.facilityForEdit.rfsAcctLedger}"
label="RFS Account Ledger" />
</rich:validator>
</h:panelGrid>
</ui:define>
<!-- Buttons that performs actions on a selected record -->
<!-- or navigate to a relevant screen -->
<ui:define name="buttons">
<h:commandButton id="submitButton" value="#{property.submitLabel}"
action="#{facilityBean.save}" styleClass="wideButton"
onclick="#{rich:component('progressWaitModalPanel')}.show()" />
<h:commandButton id="closeButton" value="#{property.closeLabel}"
action="#{facilityBean.close}" styleClass="wideButton"
immediate="true" />
<rich:popupPanel id="progressWaitModalPanel" modal="true">
<f:facet name="header">
<h:outputText value="Processing your request ...." />
</f:facet>
<h:panelGrid columns="1"
style="width: 100%; border-width: 0px; text-align: center;">
<h:outputText value="Please wait..." styleClass="dataValueStyle" />
</h:panelGrid>
</rich:popupPanel>
</ui:define>
The result is nothing. No higlight. No clue what's going on. Have I missed any installation step? I have the css and xmlnamespace in place. Anything else?
I tried to add required="true" as it was shown in the example, but that did not work either. Not sure whether it is due to richfaces bean validation issue.
The <o:highlight> works server side, based on a.o. UIInput#isValid() in JSF component tree. The <rich:validator> works client side and doesn't manipulate JSF component tree.
This indeed doesn't go well together.
I briefly looked into the HTML/JS code of the <rich:validator> showcase and it appears that they don't add a marker style class to the input elements when it's invalid (e.g. PrimeFaces does), so it's going to be hard to write a workaround when continuing the <rich:validator> approach.
You've basically following options:
Maunally write an oncomplete script which finds the validation error messages and then finds the associated inputs and then set the desired marker style class on it.
Report an issue to RichFaces guys and ask them to add a marker style class to invalid inputs via <rich:validator>, so you could style them individually.
Drop <rich:validator> and replace it by server side validation via <f:ajax>.
below you see some part of my code, i just want to select the first value in a form and the rest should be updated via ajax, for example if you select PK than, MccName, MccVorname,MccDepartment should be shown via ajax after this selection.
This should also be possible in other forms indepently,
<h:panelGrid columns="4">
<h:form id="formmcc10">
<h:outputText value="Pls select PK: " />
<p:selectOneMenu value="#categorymcc.mcccatname}" id="mcccat"
immediate="true" valueChangeListener="#categorymcc.processScat}">
<f:selectItem itemLabel="#categorymcc.mcccatname}"itemValue="" />
<f:selectItems value="#categorymcc.categoryName}" />
<p:ajax update="formmcc10:mccscat1 formmcc10:mccscat2 formmcc10:mccscat3" event="change" />
</p:selectOneMenu><h:outputText value="Mcc Name" />
<p:selectOneMenu value="#{categorymcc.submcccatname}"id="mccscat1">
<f:selectItemsvalue="#{categorymcc.subCategoryName}" />
</p:selectOneMenu>
<h:outputText value="Mcc Vorname" />
<p:selectOneMenu value="#{categorymcc.subsubmcccatname}"id="mccscat2">
<f:selectItems value="#{categorymcc.subSubCategoryName}" />
</p:selectOneMenu>
<h:outputText value="Mcc Department:" />
<p:selectOneMenu value="#{categorymcc.abteilung}" id="mccscat3">
<f:selectItems value="#{categorymcc.abteilungCategoryName}" />
</p:selectOneMenu>
</h:form>
</h:panelGrid>
This could be anything, but I encountered one interesting problem like that recently. I tried to output a bean property like #{myBean.otherBean.name} and it worked when I loaded the page by normal request, but it didn't work with AJAX. When I tried #{myBean.otherBean.id}, it worked in both cases.
The problem was, that backend system didn't fill all data for otherBean on AJAX request, it filled only id (probably for better performance). I had to prepare a getOtherBeanById method and when I called that, AJAX started to work as expected.
I'm not an expert on this field, perhaps someone has a more precise explanation for that.
So in the following code the ajax inside the header facet does not call the backing bean (but it seems to call the execute and render I think) but the link outside the datatable works perfectly fine does anyone have any Idea why?
<h:commandLink value="Types" >
<f:ajax listener="#{typeBean.sortTypeList()}" execute="#this" render="#this"/>
</h:commandLink>
<p:dataTable id="fluidTable" widgetVar="fluidTable" var="vehBase" value="#{vehicleBean.currentVehicleBaseSet}" >
<p:columnGroup type="header">
<p:row>
<p:column rowspan="" >
<f:facet name="header">
<h:panelGroup>
<h:commandLink value="Types" >
<f:ajax listener="#{typeBean.sortTypeList()}" execute="#this" render="#this"/>
</h:commandLink>
</h:panelGroup>
</f:facet>
</p:column>
</p:row>
</p:columnGroup>
Put data table inside of primefaces panel and instead of h:commandLink use primefaces commandlink or button, if you use primefaces in the page, all components should be in primefaces.
I have a problem are that when I try update a component that not are in same xhtml.
Somebody know how to do?
thx
PD: im using primefaces 3.2
Sorry for my english
I think that I dnot explain very well.
I have a xhtml father with tis structure:
<h:panelGrid id="tabla">
<h:form id="formTripu" prependId="false">
<h:panelGrid id="fichaTripulante">
<ui:include src="path1" />
<p:spacer height="5px" />
<p:tabView dynamic="false" cache="true">
<p:tab title="#{bundleTrip.datosAdministrativos}">
<ui:include
src="path2" />
</p:tab>
<p:tab title="Datos Operativos ">
<ui:include
src="path3" />
</p:tab>
I wish to do are when for example in path1 I use a h:selectBooleanCheckbox like:
<h:selectBooleanCheckbox inmediate="true" id="checkExt"
value="#{bean.Obj.field}">
<f:ajax render="estadoTripu"
actionListener="#{bean.method}" />
</h:selectBooleanCheckbox>
estadoTripu are in path2 (otherxthml but in same form).
<p:panel>
<h:panelGrid id="datos" columns="5">
<p:column>
<h:selectOneMenu id="estadoTripu"
value="#{bean.Obj.Field2}">
<f:selectItems
value="#{bean.list}" var="item"
itemValue="#{item.id}" immediate="true"
itemLabel="#{item.desc}">
</f:selectItems>
</h:selectOneMenu>
</h:panelGrid>
</p:column>
</h:panelGrid>
</p:panel>
Witch is paht in render o f:ajax????
thx everyone
try this: (Its a trick I learned from BalusC :) )
add binding="#{components.mySelecOneMenu}" to your h:selectOneMenu
<h:selectOneMenu binding="#{components.mySelecOneMenu}" .....
This how you button should look like (more or less)
<h:commandButton value="doSomeThing">
<f:ajax render="#{components.mySelecOneMenu.clientId}"/>
</<h:commandButton>
add this to your faces-config.xml
<managed-bean>
<description>Holder of all component bindings.</description>
<managed-bean-name>components</managed-bean-name>
<managed-bean-class>java.util.HashMap</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
Here some detailed explanation of what I just recommend you to do
How do I break the tyranny of the clientID?
JSF component binding without bean property
if they are not in the same xhtml, do you include one in the other? If not, just change page and it will show the correct one.
But I don't think I correctly understand your question.
Add some code please
I find that component should be in same form an call ids start in form to component, its prefered put id every panelgrid, panel, etc because you have to call every component englobe comoponent that you want render.