I'm currently using JSF 1.2, and Richfaces 3.3.3.
I get a quite strange bug with a combobox in a rich:datatable :
The first time I click and select a value, it's working, and via ajax:support, it updates the page as required. But then, if I try to change the value in the combobox, it seems "blocked"... field is not editable, and the arrow not "clickable". If I click on another field of the page, then come back, it usually works better (but not always).
Here is the code :
<rich:column style="border:none;" id="KitCol">
<f:facet name="header">
<h:outputText value="Kit"/>
</f:facet>
<rich:comboBox id="kit" value="#{deployItem.kit}"
directInputSuggestions="true" defaultLabel="Enter kit name >
<f:selectItems value="#{deployItem.kits}" />
<a4j:support event="onchange" action="#{deployItem.kitChanged}"
reRender="deployActions, deployTable">
<f:setPropertyActionListener value="true" target="#{deployController.atLeastOneItem}" />
</a4j:support>
</rich:comboBox>
</rich:column>
Would somebody have an idea about how to solve this issue ?
Thanks in advance.
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.
First of all I am new to AJAX and JSF so excuse my ignorance.
I am troubleshooting an issue on one of our existing applications.
Basically we want to rerender certain input fields if another has a value in it.
The code looks as follows
<rich:column valign="top" align="center">
<f:facet name="header">QTY Locos <br/>Staged</f:facet>
<h:inputText id="qtyLocos" value="#{dataItem.qtyLocosStaged}" width="80px" disabled="#{dataItem.rejected or !stagingDetailBean.editable}" styleClass="inputValidNumber">
<rich:jQuery selector="#qtyLocos" timing="onload" query="numeric" />
<a4j:support event="onchange" limitToList="true" reRender="facesMessagePanel, locoType, teleRequired, crewQualification" />
</h:inputText>
</rich:column>
<rich:column valign="top" styleClass="inputValid" id="locoType" align="center">
<f:facet name="header">Loco Type</f:facet>
<h:selectOneMenu value="#{dataItem.locoType}" disabled="#{dataItem.qtyLocosStaged eq 0 or dataItem.rejected or !stagingDetailBean.editable}">
<f:selectItem itemValue="" itemLabel="" />
<f:selectItem itemValue="6E" itemLabel="6E" />
<f:selectItem itemValue="6E1" itemLabel="6E1" />
<f:selectItem itemValue="7E" itemLabel="7E" />
</h:selectOneMenu>
</rich:column>
<rich:column valign="top" styleClass="center" id="teleRequired">
<f:facet name="header">Telemeter<br/>Required</f:facet>
<h:selectBooleanCheckbox value="#{dataItem.telemeterRequired}" disabled="#{dataItem.qtyLocosStaged eq 0 or dataItem.rejected or !stagingDetailBean.editable}"/>
</rich:column>
On certain browsers when you enter a value in the input field id=qtyLocos the drop down list and tick box becomes active as the criteria for disabled is now false.
But it happens in certain browsers that when you enter a value and the onchange event kicks in it physically removes the HTML tags for the drop down and the tick box. So my page renders completely incorrect.
Is anyone aware of issues with certain versions of chrome and ajax that could explain this behavior?
Some more info regarding this issue. The column headers dont disappear they are still visable. Just the inputs are missing, shifting all the fields after these fields to the left (and then not aligning with its column name anymore)
Ok this problem is getting weirder by the moment. This ONLY happens on machines that are on the company domain. Any machine that doesnt log onto the domain this does not happen. Can company policies influence how these things gets rendered?
<p:inputText value="#{bmiCalculatorBean.height}" update="#form" id="height">
<p:ajax update="#form" />
<f:convertNumber pattern="0" />
</p:inputText>
<p:inputText value="#{bmiCalculatorBean.weight}" update="#form" id="weight">
<p:ajax update="#form" />
<f:convertNumber pattern="0" />
</p:inputText>
I have a problem where after I enter a value into the first inputText and click on the "weight" inputText after a short delay the focus is lost and you need to click on the input box again.
How do I fix this?
This is caused by update="#form" and expected behavior.
In general, just do not update parts which do not need to be updated and update only those which really need to be updated. E.g. only the result calculated so far and the <h|p:message> of the current input:
<p:ajax update="calculatedResult currentInput_message" />
True, this may end up in a boilerplate of IDs in update attribute in large forms. The PrimeFaces Selectors (PFS, supporting jQuery selector syntax in JSF selectors) may then help a lot in this.
Following this example http://livedemo.exadel.com/richfaces-demo/richfaces/dataTable.jsf?tab=editDataTable&cid=101317 I created a modal panel used for editing an entry. The difference is that one of my inputText fields has a suggestion box:
<h:inputText id="entryName" value="#{controller.currentItem.name}" validator="#{controller.entryNameValidator}"/>
<rich:suggestionbox id="suggestionBoxId" for="entryName" suggestionAction="#{controller.autocomplete}" var="result">
<h:column>
<h:outputText value="#{result.name}" />
</h:column>
</rich:suggestionbox>
<rich:message for="entryName"/>
The problem is that when the modal appears and I change a single letter in the "entryName" the suggestion takes place, but when it finds no suggestions it reverts the changed value (the one without the letter i just deleted) to the original value (the one before deleting). If on the other hand it finds some suggestions it still reverts the value to the old one but also prints the suggestions in the modal right below "entryName" (and not in a suggestion box, it's just grey text). Also the suggestion triggers only once. If I lets say change "hello" to "hell" it reverts back to "hello" and the next time i try to modify it to "hell" nothing happens.
What am I doing wrong? Oh also I'm using the very exact same code in my jsf view when adding entries (it's not a modal though, just a table) and it works fine.
#Edit: apparently enclosing it with a "a4j:region" helps a bit as at least I'm able to see the suggestion box (but in the background, so I have to set the zindex) and in the left corner of the browser not below the "entryName" AND still I can't click it (it just sits there and doesn't disappear even after closing the modal), the suggestions still are printed below the inputText (not in a suggestionBox and in grey) and it still triggers only once...
try this modify the following stuff as per your requirement.
enter code here <h:panelGrid columns="2" cellpadding="0" cellspacing="0">
<h:inputText id="input" size="30"/>
<h:graphicImage value="#{facesContext.externalContext.requestContextPath}/../images/arrow.png"
onclick="#{rich:component('equity')}.callSuggestion(true)"
alt="click" />
</h:panelGrid>
<rich:suggestionbox width="200"
suggestionAction="#{StockMasterServiceBean.suggest}" var="stock" id="equity" for="input">
<h:column>
<h:outputText value="#{stock.symbolId}"/>
</h:column>
<h:column>
<h:outputText value="#{stock.companyName}" />
</h:column>
<a4j:support ajaxSingle="true" event="onselect" reRender="abc,xyz">
<f:setPropertyActionListener value="#{stock}" target="#{StockMasterServiceBean.selectedStockMaster}"/>
</a4j:support>
</rich:suggestionbox>
I'm making a webapp in Seam but ran into a problem I can't seem to fix.
I have a JSF form where the customer can select a reservation type through a combobox. Based on the selected value, other form components gets rendered.
For example: the customer selects Hours as reservation type, a panelGroup gets rendered where the customer can select a start- and an end hour. But if the customer would select 'part of the day' as reservation type, a selectOneMenu gets rendered where the customer can select a part of the day (morning, afternoon, evening)
The rerendering well but the values of the components with a rendered conditional won't get passed to the bean. They stay null values.
This is the code i'm talking about:
<s:div id="spot"
rendered="#{selectedProduct.productType.name eq 'Flex Spot'}">
<h:panelGrid columns="2">
<h:outputText value="Reservation Type" />
<h:selectOneMenu value="#{selectedPeriodPart}">
<s:selectItems
value="#{productManager.getAvailableDayPartsSpot()}"
var="daypart"
label="#{daypart.label}"></s:selectItems>
<s:convertEnum />
<a4j:support ajaxSingle="true"
event="onchange"
action="#"
reRender="spot">
</a4j:support>
</h:selectOneMenu>
<h:outputText id="date_spot" value="Date" />
<a4j:outputPanel id="calendar_spot" layout="block">
<rich:calendar value="#{reservation.reservationPeriod.startDate}"
locale="en" cellWidth="24px"
cellHeight="22px"
style="width:200px" />
</a4j:outputPanel>
<h:outputText rendered="#{selectedPeriodPart eq 'DAY_PART'}"
value="Daypart" />
<h:selectOneMenu value="#{selectedDaypart}"
rendered="#{selectedPeriodPart eq 'DAY_PART'}">
<f:selectItem id="si_morning" itemLabel="Morning (6:00 - 12:00)"
itemValue="morning" />
<f:selectItem id="si_afternoon"
itemLabel="Afternoon (12:00 - 18:00)" itemValue="afternoon" />
<f:selectItem id="si_evening" itemLabel="Evening (18:00 - 00:00)"
itemValue="evening" />
</h:selectOneMenu>
<h:outputText rendered="#{selectedPeriodPart eq 'HOURS'}"
value="Hours" />
<h:panelGroup id="hours_spot"
rendered="#{selectedPeriodPart eq 'HOURS'}">
<ui:include src="/includes/reservation/select_hours.xhtml" />
</h:panelGroup>
</h:panelGrid>
</s:div>
Note: The calendar value do get passed back to the bean but the value of this piece of code doesn't (it does if you remove the rendered conditional):
selectOneMenu value="#{selectedDaypart}" rendered="#{selectedPeriodPart eq 'DAY_PART'}"
You need to ensure that the conditionals responsible for the outcome of the rendered attribute are also the same in the subsequent request of the form submit. Because when a component isn't rendered, JSF won't apply the request values them.
In a nutshell, the property behind #{selectedPeriodPart} needs to be the same in the subsequent request. There are several solutions:
Put bean in session scope. Easiest solution, but bad for server memory and client experience (updates would be reflected in multiple tabs/windows in same session).
Pass it through using <h:inputHidden>. Not sure though how this fits in the Ajax/Richfaces picture. Better use <a4j:keepAlive> here.
Use a conversation scope. Seam offers facilities for this.
I fixed it -.- Nothing was wrong with the code I posted.
Because I wasn't able to solve this issue I continued on an other page in the same conversation. I noticed some more strange behaviour: outjection of a variable didn't work etc.
I figured the mistake was in some other part of the code which, after corrected, fixed the whole problem.
Thx for answering guys!