JSF Flash Scope remembers too many messages - jsf

I have a simple flow in my appliaction - if you fill out and press save on one form (if everything goes well) you are redirected to a second view with a list. Now I wanted to add a message saying "You successfuly added an object" but since I'm using a redirect from what I remember I need to use the Flash scope. And so I did. The problem is that during the first "save" it correctly shows only 1 message but when I navigate back to the form and hit "save" it will show me the current message and the old one! It's even stranger that when (for the 3rd time) I go back to the form and hit "save" I again get only 1 message (and so on 1-2-1-2-1-2 etc...). Am I doing something wrong or is it a bug in jsf? I mean my I'm calling the same method and get different results...
I'm using primefaces and the newest mojarr:
jsf-api-2.1.1-b04
jsf-impl-2.1.1-b04
primefaces-2.2.1
Here's the code (most relevant parts at least):
SaveForm.xhtml:
<div id="content-box" class="content-box">
<p:panel id="content-panel" header="Dane raportu"
styleClass="content-panel">
<div class="content-box">
<h:form prependId="false">
<h:panelGrid id="grid" columns="2" styleClass="content-panel">
<!-- some inputs and labels -->
<p:commandButton value="#{msg['thesis.save.button']}"
action="#{thesisBean.saveThesis}" />
</h:panelGrid>
</h:form>
</div>
</p:panel>
</div>
saveThesis method:
public String saveThesis() {
//this creates a Hibernate entity and saves it to the DB
thesisService.addThesis(createThesisEntity());
FacesContext context = FacesContext.getCurrentInstance();
context.getExternalContext().getFlash().setKeepMessages(true);
ResourceBundle bundle = context.getApplication().getResourceBundle(
context, "msg");
context.addMessage(null,
new FacesMessage(FacesMessage.SEVERITY_INFO, "key1",
"key2"));
return "list-theses.xhtml?faces-redirect=true";
}
list-theses.xhtml:
<ui:composition template="/basicTemplate.xhtml">
<ui:define name="content">
<p:growl id="growl" showDetail="true" sticky="false" life="5000" />
<div id="content-box" class="content-box">
<h:form prependId="false" id="table-form">
<p:dataTable var="thesis" value="#{thesisTableBean.theses}"
paginator="true" rows="20">
<p:column styleClass="table-name-column">
<f:facet name="header">
<h:outputText value="#{msg['thesis.table.name.header']}" />
</f:facet>
<h:outputText value="#{thesis.firstName} #{thesis.lastName}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{msg['thesis.table.title.header']}" />
</f:facet>
<h:outputText value="${thesis.title}" />
</p:column>
<p:column styleClass="table-number-column">
<f:facet name="header">
<h:outputText value="#{msg['thesis.table.number.header']}" />
</f:facet>
<h:outputText value="${thesis.number}" />
</p:column>
</p:dataTable>
</h:form>
</div>
</ui:define>

Well I found a "solution" here: http://ocpsoft.com/java/persist-and-pass-facesmessages-over-page-redirects/ Seems to work pretty well. Still I have no idea why my code isn't working. I mean it's the same method every time but the result differs...

Related

p:commandButton not working within a p:dataTable while using filter

I am using JSF, Primefaces 5.2 and GlassFish 4.1.
I have set up a simple project to test and replicate my larger issue and found it is repeatable within the test project.
I have a simple page with a simple list of objects. I am using the <p:dataTable> and using the global search capability and pagination.
Table Code
<ui:define name="content">
<h:form id="carsForm" >
<p:dataTable id="singleDT" var="c" value="#{testFlow.cars}" widgetVar="carsTable" rows="10" paginator="true"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15" emptyMessage="No cars found with the given criteria" reflow="true"
filteredValue="#{testFlow.filteredCars}">
<f:facet name="header">
<p:outputPanel class="fright">
<h:outputText value="Search all fields: " />
<p:inputText id="globalFilter" onkeyup="PF('carsTable').filter()" style="width:200px" placeholder="Enter keyword" />
</p:outputPanel>
<p:outputPanel class="Fleft">
<p:commandButton value="New Car" action="addCar" />
</p:outputPanel>
<div class="EmptyBox5"></div>
</f:facet>
<p:column filterBy="#{c.id}" headerText="ID" sortBy="#{c.id}" >
<h:outputText value="#{c.id}"/>
</p:column>
<p:column filterBy="#{c.m}" headerText="Model Year" sortBy="#{c.modelYear}" >
<h:outputText value="#{c.modelYear}"/>
</p:column>
<p:column filterBy="#{c.make}" headerText="Make" sortBy="#{c.make}" >
<h:outputText value="#{c.make}"/>
</p:column>
<p:column filterBy="#{c.model}" headerText="Model" sortBy="#{c.model}" >
<h:outputText value="#{c.model}"/>
</p:column>
<p:column filterBy="#{c.color}" headerText="Color" sortBy="#{c.color}" >
<h:outputText value="#{c.color}"/>
</p:column>
<p:column style="width: 200px; text-align: center">
<p:commandButton actionListener="#{testFlow.removeCar(c)}" value="Delete" update="singleDT messages" ajax="true" >
<p:confirm header="Confirmation" message="Are you sure?" icon="ui-icon-alert" />
</p:commandButton>
</p:column>
</p:dataTable>
<div class="EmptyBox5"></div>
<p:panel>
<p:commandButton action="returnFromTestFlow" value="Exit the Flow" />
</p:panel>
</h:form>
<p:messages id="messages" autoUpdate="true" closable="true" />
<p:confirmDialog global="true" showEffect="fade" hideEffect="explode">
<p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
<p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
</p:confirmDialog>
</ui:define>
My Controller has a simple method to remove the object.
Method
public String removeCar(Inventory c) {
String redirectTo = "/testFlow/testFlow";
try {
this.cars.remove(c);
iFacade.remove(c);
} catch (Exception e) {
System.out.println(e.getMessage());
}
return redirectTo;
}
When I remove all the filtering and sorting, the method is called after I click yes and the row is deleted. While the filtering and sorting is in place, however, the entire table just re displays as empty but no method is ever called. No error appears, and while using the debugger it never hits a break-point within the method in question.
Any help or direction would be greatly appreciated.
I think the problem is that the datatable is first rendered using the list you provided, but when you press a button it searches through the filtered list and since this is empty at first it cannot locate the button. Notice on the other hand, that if you enter a search criteria and delete it again, the buttons work. This is because the filtered list has been populated and the button can now be located. To solve this problem you need to populate the filtered list with all the values pre render. In your case:
In your backing bean:
public void init()
{
if(!FacesContext.getCurrentInstance().isPostback())
{
filteredCars = cars;
}
}
In your xhtml file:
<f:event type="preRenderView" listener="#{testFlow.init}"/>;
Another way is using the #PostConstruct annotation on your init() function instead of <f:event type="preRenderView />which is clearer code, but, in my opinion, a bit vague in terms of when the function is called.
Had the same problem, #djst solution didn't work for me, but I ended up fixing the problem by using Omnifaces form (o:form) instead of standard h:form. Not sure why, though, but may be worth a try.
When you are using the filtering, primefaces creates a list and shows it in the result, when you are deleting an item from the main list, it has nothing to do with the display list, and this may cause problems like what happened to you.

Primefaces datatable update datatable

I have a problem with primefaces datatables. I have one datatable with some entries and a column with a button inside. If the button is pressed a popup is opened with another datatable. The entries in the second datatable are depending on the row in which the button is pressed.
<!-- first datatable -->
<h:form id="list">
<p:dataTable id="list1" var="item" value="#{bean1.itemlist}"
rowKey="#{item.id}" selection="#{bean1.selectedItem}"
selectionMode="single">
<p:column headerText="ID">
<h:outputText value="#{item.id}" />
</p:column>
...
<p:column headerText="Edit Entries">
<p:commandButton value="Edit Entries"
actionListener="#{bean2.updateEntries(item)}" ajax="true"
oncomplete="PF('edit_entries').show()" />
</p:column>
</p:dataTable>
<!-- Second datatable in the popup -->
<p:dialog header="Edit Entries" widgetVar="edit_entries" modal="true"
resizable="false">
<p:dataTable id="list2" var="entry"
value="#{bean2.entriesList}" rowKey="#{entry.id}"
selection="#{bean2.selectedEntry}" selectionMode="single">
<p:column headerText="Entry Number">
<h:outputText value="#{entry.number}" />
</p:column>
</p:dataTable>
<f:facet name="footer">
<p:commandButton value="Save" oncomplete="PF('edit_entries').hide()" />
</f:facet>
</p:dialog>
</form>
Bean2
public void updateEntries(Item selectedItem) {
this.entriesList = this.entriesQuery.getAllEntriesByItemID(selectedItem.getId());//db query could take some time
System.out.println("entrieslist size: " + this.entriesList.size()); //prints the correct size
}
The problem is that there are no entries listed in the popup datatable although there are some in the list after the db query.
Any ideas how to fix this bug?
Thanks in advance!
UPDATE 1:
<!-- first datatable -->
<h:form id="list">
<p:dataTable id="list1" var="item" value="#{bean1.itemlist}"
rowKey="#{item.id}" selection="#{bean1.selectedItem}"
selectionMode="single">
<p:column headerText="ID">
<h:outputText value="#{item.id}" />
</p:column>
...
<p:column headerText="Edit Entries">
<p:commandButton value="Edit Entries" update=":dialogUpdateEntries"
actionListener="#{bean2.updateEntries(item)}" ajax="true"
oncomplete="PF('edit_entries').show()" />
</p:column>
</p:dataTable>
</h:form>
<!-- Second datatable in the popup -->
<p:dialog header="Edit Enries" id="dialogUpdateEntries" widgetVar="edit_entries" modal="true"
resizable="false">
<h:form id="formEntriesList">
<p:dataTable id="list2" var="entry"
value="#{bean2.entriesList}" rowKey="#{entry.id}"
selection="#{bean2.selectedEntry}" selectionMode="single">
<p:column headerText="Entry Number">
<h:outputText value="#{entry.number}" />
</p:column>
</p:dataTable>
<f:facet name="footer">
<p:commandButton value="Save" oncomplete="PF('edit_entries').hide()" />
</f:facet>
</form>
</p:dialog>
You're indeed not updating the data table in the dialog. JSF doesn't automatically update the view on change of the model, you have to explicitly tell the view to do so. You can use the ajax action component's update attribute for this. This takes a JSF client ID which can be found by rules as outlined in this related answer: How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar".
Given the markup as shown in the question, that'll be
<p:commandButton ... update=":list:list2" />
However, there's another potential problem. You're using <p:dialog modal="true"> inside a form instead of giving the dialog its own form. This way the dialog may not be available in the HTML DOM tree as JavaScript (the one responsible for dealing with ajax stuff) would expect to find it. Giving the dialog its own form should fix this matter. It'll also fix the potential future problems with invoking actions from inside the dialog as handled in this related question: <p:commandbutton> action doesn't work inside <p:dialog>.
<h:form id="viewForm">
...
<p:commandButton ... update=":editDialog" />
...
</h:form>
<p:dialog id="editDialog" modal="true">
<h:form id="editForm">
...
</h:form>
</p:dialog>
Try adding update="list2" to Edit Entries command button (even update="#widgetVar(edit_entries)" should work).
If, because of page layout and structure, you can't target the second datatable using above suggestions, then add styleClass="tList2" to second table, and update it with update="#(.tList2)" on edit button.

Getting a NullPointerException while Partial rendering via FacesContext

I have a strange behavior where I am getting NPE while doing page refresh using faces context.
I have a managed bean which is in Request Scope. So want to refresh the page after click on commandbutton. I have tried with 'update' but it is behaving strange in my page.
Error: PartialViewContextImpl$PhaseAwareVisitCallback.visit : java.lang.NullPointerException
This is my JSF page:
<h:form id="form">
<p:messages autoUpdate="true"/>
<h:panelGrid columns="4" cellpadding="5" id="panelGrid" rendered="true">
<p:outputLabel for="s00" value="#{tk.expense_keyword}"/>
<p:inputText id="s00" value="#{expense.form.keyword}"/>
<p:outputLabel for="s02" value="#{tk.expense_creatorId}"/>
<p:inputText id="s02" value="#{expense.form.creatorId}" disabled="#{!expense.form.canEditCreatorId}"/>
<h:outputText id="s10" value="Amount Between #{expense.form.amountFrom} and #{expense.form.amountTo}" />
<h:panelGrid>
<p:slider for="s11,s12" display="s10" minValue="0" maxValue="1000" style="width: 200px" range="true" displayTemplate="Amount Between {min} and {max}" />
<h:inputHidden id="s11" value="#{expense.form.amountFrom}" />
<h:inputHidden id="s12" value="#{expense.form.amountTo}" />
</h:panelGrid>
</h:panelGrid>
<p:commandButton value="#{tk.expense_search}" id="a01" action="#{expense.search}" ajax="false" immediate="true"/>
<p:dataTable var="line" varStatus="loop" value="#{expense.form.expenseEntryList}" emptyMessage="#{tk.expense_table_empty}" id="dataTable">
<p:column headerText="#{tk.expense_table_creatorId}">
<h:inputHidden value="#{line.oid}"/>
<h:inputText value="#{line.creatorId}"/>
</p:column>
<f:facet name="footer">
<p:commandButton value="#{tk.expense_saveAsDraft}" id="a06" action="#{expense.saveAsDraft}"/>
<p:commandButton value="#{tk.expense_submit}" id="a07" action="#{expense.submitAll}"/>
<p:commandButton value="#{tk.expense_validate}" id="a08" action="#{expense.validate}"/>
</f:facet>
</p:dataTable>
</h:form>
Here when I click on Save As Draft I want to refresh the page. So I am using FacesContext's method to refresh the page.
Here is my method saveAsDraft:
public Outcome saveAsDraft() throws Exception{
try {
saveAsDraftBody(false,false);
getFacesContext().getPartialViewContext().getRenderIds().add("form:panelGrid");**//**getting error****
getFacesContext().getPartialViewContext().getRenderIds().add("form:dataTable");**//**works fine****
Log.info(this,"getFacesContext().getPartialViewContext().getRenderIds(): "+getFacesContext().getPartialViewContext().getRenderIds());
return Outcome.SUCCESS;
}
catch (Throwable e){
throw manageError(e);
}
}
I don't know why it works for data table refresh but not for panelGrid :(
First of all you have the bean in request scope and you are making full page submit and here the partial render does not make any sense. The error you are getting because you have component which is basically, another input into a form which will be sent to the managed bean of the current view when the form is submitted.

JSF rendered is not working after commandButton

I have a JSF application using Primefaces 3.5. I have a page where after click in a commandButton I call a method in Managed Bean which will fill a list that will be showed in fields tblPerfis and txtPerfis below.
<ui:composition template="...">
<ui:define name="content">
<h:form id="formPrincipal">
<br />
<p:fieldset legend="Pesquisa de Perfil" >
<p:panelGrid columns="2" >
<f:facet name="footer">
<p:commandButton id="btnPesquisar"
actionListener="#{perfilAcessoMB.pesquisar}" value="Pesquisar"
update="tblPerfis txtPerfis pnlPerfis"
styleClass="ui-icon-search" />
</f:facet>
</p:panelGrid>
</p:fieldset>
<br />
<h:outputText id="txtPerfis" value="Perfis: #{perfilAcessoMB.perfis}" ></h:outputText>
<p:dataTable id="tblPerfis" value="#{perfilAcessoMB.perfis}" var="perfil" emptyMessage="Nenhum perfil encontrado." >
<p:column headerText="Nome">
<h:outputText value="#{perfil.descricao}"></h:outputText>
</p:column>
</p:dataTable>
<p:outputPanel id="pnlPerfis">
<p:fieldset id="resultadoPesquisa" legend="Resultado da Pesquisa">TESTE</p:fieldset>
</p:outputPanel>
</h:form>
</ui:define>
</ui:composition>
The called method is the follow:
#ManagedBean
#ViewScoped
public class PerfilAcessoMB {
public void pesquisar(ActionEvent event) {
// Fill perfis List
}
}
At principle, it works as waited. My problem happens when I want add rendered attribute:
<h:outputText id="txtPerfis" value="Perfis: #{perfilAcessoMB.perfis}" rendered="#{not empty perfilAcessoMB.perfis}" ></h:outputText>
<p:dataTable id="tblPerfis" value="#{perfilAcessoMB.perfis}" rendered="#{not empty perfilAcessoMB.perfis}" var="perfil" emptyMessage="Nenhum perfil encontrado." >
<p:column headerText="Nome">
<h:outputText value="#{perfil.descricao}"></h:outputText>
</p:column>
</p:dataTable>
<p:outputPanel id="pnlPerfis" rendered="#{not empty perfilAcessoMB.perfis}">
<p:fieldset id="resultadoPesquisa" legend="Resultado da Pesquisa">TESTE</p:fieldset>
</p:outputPanel>
Even when there is results, these fields are not showed. Does someone have any idea what is happening here?
Thanks,
Rafael Afonso
EDIT
Following a workmate suggestion, I changed the code to put dataTable and outputText inside outputPanel. The commandButton will reference the outputPanel but the rendered attibute will be put in datatable and outputText.
<p:commandButton id="btnPesquisar"
actionListener="#{perfilAcessoMB.pesquisar}" value="Pesquisar"
update="pnlPerfis"
styleClass="ui-icon-search" />
<p:outputPanel id="pnlPerfis">
<h:outputText id="txtPerfis" value="Perfis: #{perfilAcessoMB.perfis}" rendered="#{not empty perfilAcessoMB.perfis}" ></h:outputText>
<p:dataTable id="tblPerfis" value="#{perfilAcessoMB.perfis}" rendered="#{not empty perfilAcessoMB.perfis}" var="perfil" emptyMessage="Nenhum perfil encontrado." >
<p:column headerText="Nome">
<h:outputText value="#{perfil.descricao}"></h:outputText>
</p:column>
</p:dataTable>
</p:outputPanel>
After this, the page worked as waited.
However, I still did not understand what happened. What is the explanation for this behaviour?
Your problem occurs because our table is not rendered it simply does not exist in your html code, that is not in this context to be found to update or another source.
When you shut a larger scope as the panel and force an update in this it forces the table to check the condition for rendering, if yes the code is written and can be seen without problems.

Primefaces - Cannot find component with identifier outside the datatable

<ui:define name="content">
<f:view>
<h:form id="myForm" styleClass="form" >
<p:dataTable var="provider" id="ss" value="#{providerSelectBean.providerList}" rowKey="#{provider.license}"
selection="#{providerSelectBean.selectedProvider}" selectionMode="single">
<p:ajax listener="#{providerSelectBean.onRowSelect}"
update=":myForm:output"event="rowSelect"/>
<p:column sortBy="#{provider.license}" width="110" >
<f:facet name="header">
<h:outputText value="License#" />
</f:facet>
<h:outputText value="#{provider.license}" />
</p:column>
<p:column sortBy="#{provider.prgName}" width="110" >
<f:facet name="header">
<h:outputText value="Program Name" />
</f:facet>
<h:outputText value="#{provider.prgName}" />
</p:column>
</p:dataTable><br/>
<p:panelGrid id="output" >
<h:outputText value="License" />
<h:outputText value="#{provider.license}" />
</p:panelGrid>
</h:form>
</f:view>
</ui:define>
This is my first stint with JSF2.0 and primefaces 3.4.1 and the <p:ajax update gives an error
javax.faces.FacesException: Cannot find component with identifier
":myForm:output" referenced from "myForm:ss"
Try to inspect the generated HTML code and see the actual id being generated for your panelGrid and update that id. If it happens to be dynamic, you can always use the JQuery CSS selectors (I find myself doing that pretty often). In your case, you can go like this:
update="#([id$=output])"
This expression stands for every component whose id ends with output. Take a look at the JQuery docs for more info.
You can also use :#{p:component(componentId)} as in
<p:ajax listener="#{providerSelectBean.onRowSelect}"
update=":#{p:component('output')}" event="rowSelect"/>
Quoting BalusC's answer to Get id of parent naming container in template for in render / update attribute:
p:component is a helper function that scans the entire view root for a component with the given ID and then returns its client ID.

Resources