refresh table after file download - ajax

Hi i'm using an h:commandButton to download a file after click like this :
<h:commandButton id="getDownload" value="download" action="#{controller.download()}" >
</h:commandButton>
<rich:dataTable
value="#{controller.listData}" var="category" id="table" >
<f:facet name="header">
<rich:columnGroup>
<h:column>
<h:outputText styleClass="headerText" value="Make" />
</h:column>
</rich:columnGroup>
</f:facet>
<h:column>
<h:outputText value="#{category}" />
</h:column>
</rich:dataTable>
FacesContext fc = FacesContext.getCurrentInstance();
HttpServletResponse response = (HttpServletResponse) fc.getExternalContext().getResponse();
out = response.getOutputStream();
download is working fine but the rich:datatable is not up-to-date after download
i trying to use the following code but it doesn't work:
<h:commandButton id="getDownload" value="download" action="#{controller.download()}" >
<a4j:support event="onclick" disableDefault="true" reRender="table"/>
</h:commandButton>
The h:commandButon is using because we can't download file using ajax
Someone have any idea how can i refresh my table after button action?

Related

Rendering datatable column with ajax and jsf

I have a datatable listing some items with several details :
<h:dataTable id="versionInterfaces_datatable"
styleClass="datatable" rowClasses="odd,even"
value="#{versionToolManager.version.interfaces}"
var="lInterface">
<h:column>
<f:facet name="header">Interface Name</f:facet>
<h:commandLink id="versionInterfacesName_columnLink"
value="#{lInterface.name}"
action="#{interfaceManager.consult}">
<f:setPropertyActionListener
target="#{interfaceManager.interfaceEntity}"
value="#{lInterface}" />
</h:commandLink>
<h:outputText id="versionInterfacesName_column" value="#{lInterface.name}" />
</h:column>
<h:column id="interfaceVersions_column">
<f:facet name="header">Interface Version(s)</f:facet>
<ui:repeat value="#{lInterface.versionsInterface}" var="lVersionI"
varStatus="lStatus">
<h:outputText rendered="#{lVersionI.versionsTools.contains(versionToolManager.version)}" value=" #{lVersionI.name} | " />
</ui:repeat>
</h:column>
<h:column>
<f:facet name="header">Interface Description</f:facet>
<h:outputText id="versionInterfacesDescription_column"
value="#{lInterface.description}" />
</h:column>
and then I have a button calling a modal view allowing to add items :
<h:commandButton id="#{id}OpenModal_button"
value="#{openButtonValue}"
onclick="document.getElementById('#{formId}:#{modal_panel}').style.display='block'; return false;" />
<br />
when closing this modal view, I try to "refresh" the datatable to see the items added :
<h:commandButton id="#{id}CloseModal_button"
value="#{closeButtonValue}">
<f:ajax execute="#this"
render="#{renderOnClose} #{formId}:#{modal_panel}" />
</h:commandButton>
But the columns of my datatable are not all updated, the column "Interface Version(s)" is empty for the new lines corresponding to the new items even though when I save, they have been well added.
Do you have any idea ?
the problem is <f:ajax execute="#this" ...
use <f:ajax execute="#all" ...
So I succeed to solve my problem but it wasn't a problem about the syntax but a bad use of the model and beans structure. Without going into details, I was trying to reach data which weren't linked to the corresponding items.

get informed about ajax error in p:ajaxStatus

I have some ajax-operations, and if I execute one method, the Ajax-status displays me "error". I have no idea, what did fail.
Do you have any ideas, how I can fetch the ajax-error-message in case there is one to solve the problem?
<!-- AJAX-STATUS INFO -->
<p:ajaxStatus style="width:64px;height:64px;position:fixed;right:5px;bottom:5px" id="aj">
<f:facet name="start">
<p:graphicImage value="resources/images/loading.gif" />
</f:facet>
<f:facet name="complete">
<h:outputText value="Complete" />
</f:facet>
<f:facet name="prestart">
<h:outputText value="Starting..." /> </f:facet>
<f:facet name="error"> <h:outputText value="Error" />
</f:facet>
<f:facet name="success"> <h:outputText value="Success" />
</f:facet>
<f:facet name="default"> <h:outputText value="Ready" />
</f:facet>
</p:ajaxStatus>
I can't fix the problem due to the fact that I don't know what did crash. My method is called by
<h:selectBooleanCheckbox value="#{bean.booleanfield}" id="myonoffswitch" styleClass="onoffswitch-checkbox">
<f:ajax event="click" render=":main" execute="#form" listener="#{bean.reload}"/>
</h:selectBooleanCheckbox>
public void reload(AjaxBehaviorEvent event){...}
and the reload() method is executed without any errors, it finished without problems.
Somewhere after that the problem must occur? If I switch the button on, the Ajax status works fine. If i switch the button off, it says "error".
Any suggestions?

Datatable not rendering with ajax call in jsf

I have a data table that needs to be refreshed upon using an ajax command found in each row.
<div class="authorSection">
<h:dataTable id="author-table" var="author" value="#{authorPOCBean.getauthors()}">
<h:column>
<f:facet name="header">
<h:outputText value="Org Short Name" />
</f:facet>
<h:outputText id="authorOrganizationShortName" value="#author.orgShortName}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Organization Name" />
</f:facet>
<h:outputText id="authorOrganizationName" value="#{author.orgName}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Location" />
</f:facet>
<h:outputText id="authorLocation" value="#{author.orgLocation}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="author Type" />
</f:facet>
<h:outputText id="authorType" value="#{author.authorName}" />
</h:column>
<h:column>
<h:form id="deleteauthorForm">
<h:commandLink action="#{authorPOCBean.deleteauthor(author)}" value="Delete">
<f:ajax render=":author-table"/>
</h:commandLink>
</h:form>
<h:form id="setInitialauthorForm">
<h:commandLink action="#{authorPOCBean.makeInitialauthor(author)}" value="Make Initial"/>
</h:form>
</h:column>
</h:dataTable>
</div>
When the delete function is used it seems to leave the table unchanged or perhaps renders it with old data? I've got it set now to the first thing the called method does is change the internal array THEN changes the database stuff but it still uses the old data.
Is there something obviously wrong with my code?
I have looked at the below link and tried the recommendations and have no new result. In fact if I surround the table with a form the table won't build right.
JSF- <f:ajax> can't render datatable
Please be noted that you have placed the Delete Button and Make initial Buttons enclosed in a separate form whereas the DataTable component is placed outside the form .
Try having a single form starting at at the start of the table . (ie) Your table component and the two buttons should be enclosed within the same form
and for Ajaxical refresh, the following should work for you .
<f:ajax render="#form"/>
If for some other reason you cannot use a single form and need multiple forms , Please refer this question How to retain form data in a multi form page

PrimeFaces dataTable doesn''t render when exists binding attribute

I'm creating a dataTable with two dataTable inside :).
But this time I'm having problem to render it when I try use binding attribute in a h:panelGroup that wraps first dataTable.
I'm using binding to help refresh just the panelGroup, like BalusC told in this question. When I remove the binding attribute the dataTable renders normally, but of course nothing is rendered with f:ajax tags inside the dataTables.
Here is the xhtml:
<ui:component>
<h:panelGroup>
<h:panelGroup layout="block;" id="#{id}"
binding="#{painelTabelaContatos}" rendered="true">
<p:dataTable id="tabela#{id}"
value="#{modeloTabelaContatos.listaDeContatos}" var="contato"
selectionMode="single"
rowSelectListener="#{controladorTabelaContatos.processarSelecaoLinha}"
rowUnselectListener="#{controladorTabelaContatos.processarDeselecaoLinha}"
selection="#{modeloTabelaContatos.contatoSelecionado}">
<p:column headerText="Contatos">
<hrgi:editableText style="width:100%" value="#{contato.descricao}" />
</p:column>
<p:column headerText="Telefones">
<h:dataTable value="#{contato.telefones}" var="telefone">
<h:column>
<h:inputText value="#{telefone}" />
</h:column>
<h:column>
<h:graphicImage library="img" name="default_trash.png"
style="cursor:pointer;">
<f:ajax event="click" render=":#{painelTabelaContatos.clientId}"
listener="#{controladorTabelaContatos.removerTelefone(contato, telefone)}" />
</h:graphicImage>
</h:column>
</h:dataTable>
</p:column>
<p:column headerText="e-mails">
<h:dataTable value="#{contato.emails}" var="email">
<h:column>
<h:inputText value="#{email}" />
</h:column>
<h:column>
<h:graphicImage library="img" name="default_trash.png"
style="cursor:pointer;">
<f:ajax event="click" render=":#{painelTabelaContatos.clientId}"
listener="#{controladorTabelaContatos.removerEmail(contato, email)}" />
</h:graphicImage>
</h:column>
</h:dataTable>
</p:column>
<p:column>
<h:graphicImage library="img" name="default_trash.png"
style="cursor:pointer;">
<f:ajax render=":#{painelTabelaContatos.clientId}" event="click"
listener="#{controladorTabelaContatos.removerContato(contato)}" />
</h:graphicImage>
</p:column>
</p:dataTable>
</h:panelGroup>
<h:panelGroup layout="block">
<p:commandButton value="ADICIONAR CONTATO" update="#{id}"
immediate="true"
action="#{controladorTabelaContatos.adicionarContato}" />
<p:commandButton value="ADICIONAR TELEFONE" update="#{id}"
immediate="true"
action="#{controladorTabelaContatos.adicionarTelefone}" />
<p:commandButton value="ADICIONAR E-MAIL" update="#{id}"
immediate="true"
action="#{controladorTabelaContatos.adicionarEmail}" />
</h:panelGroup>
</h:panelGroup>
</ui:component>
I've already tried remove the h:dataTables that are inside p:dataTable, but without success.
This component is just the content of a PrimeFaces tab, and this tab is inside a PrimeFaces dialog. Could someone explain me why is this happening??
I've found the cause of error, after it was easy find a solution...
The problem is caused because I call this component in two different pages:
popupCadastroPessoa.xhtml
<ui:include src="../tabs/abaEdicaoContatos.xhtml">
<ui:param name="id" value="painelContatoPessoa" />
</ui:include>
and in popupCadastroFuncionario.xhtml
<ui:include src="../tabs/abaEdicaoContatos.xhtml">
<ui:param name="id" value="painelContatoFuncionario" />
</ui:include>
cause I didn't really created the binding bean, JSF gets confused. So I've just created two UIPanel beans and passed it as parameter:
<ui:include src="../tabs/abaEdicaoContatos.xhtml">
<ui:param name="id" value="painelContatoPessoa" />
<ui:param name="painelTabelaContatos" value="#{bindingTabelaContatoPessoa}"/>
</ui:include>
Was my fault. Thanks for your attention and sorry for the inconvenience.

richfaces data-table error

I am new to richfaces.
I have a problem with rich:datatable filtering, the source code of my page is like the site example:
<h:form id="form">
<rich:dataTable keepSaved="true" id="richTable" var="record" value="#{citiesBean}" rows="20">
<rich:column >
<f:facet name="header">
<h:commandLink action="#{bean.toggleSort}">
#{bean.sortOrders['cityTitle']}
<a4j:ajax render="richTable" />
<f:setPropertyActionListener target="#{bean.sortProperty}" value="#{'cityTitle'}" />
</h:commandLink>
<br />
<h:inputText value="#{citiesBean.filterValues['cityTitle']}">
<a4j:ajax render="richTable#body scroller" event="keyup" />
</h:inputText>
</f:facet>
<h:outputText value="#{record['cityTitle']}" />
</rich:column>
<rich:column >
<f:facet name="header">
<h:commandLink action="#{bean.toggleSort}">
#{bean.sortOrders['cityCode']}
<a4j:ajax render="richTable" />
<f:setPropertyActionListener target="#{bean.sortProperty}" value="#{'cityCode'}" />
</h:commandLink>
<br />
<h:inputText value="#{citiesBean.filterValues['cityCode']}">
<a4j:ajax render="richTable#body scroller" event="keyup" />
</h:inputText>
</f:facet>
<h:outputText value="#{record['cityCode']}" />
</rich:column>
<f:facet name="footer">
<rich:dataScroller id="scroller" />
</f:facet>
</rich:dataTable>
</h:form>
everything seems OK but it has some problems.
1- datascroller does not work without render attribute set to 'richTable' but it works on demo!!!
2-when i type something on filter input, the table does not get updated!, i have checked the request and response on firebug,
the response does not have a valid id, i mean it look like this:
<update id="form:richTable:tb"><tbody id="form:richTable:0:tb" ....
what is wrong with my codes?!
I am using, richfaces 4, Glassfish 3.1, Firefox 3.6
thanks in advance.
I think it was a kind of bug. Now it is fine with version 4.1 M1.

Resources