Primefaces: commandButton ajax="false" will not work with p:dataExporter and p:fileDownload
Written By
Alfonso Crisci
How To articles are not official guidelines or officially supported documentation. They are community-contributed content and may not always reflect the latest updates to Liferay DXP. We welcome your feedback to improve How To articles!
While we make every effort to ensure this Knowledge Base is accurate, it may not always reflect the most recent updates or official guidelines.We appreciate your understanding and encourage you to reach out with any feedback or concerns.
Legacy Article
You are viewing an article from our legacy "FastTrack"
publication program, made available for informational purposes. Articles
in this program were published without a requirement for independent
editing or verification and are provided"as is" without
guarantee.
Before using any information from this article, independently verify its
suitability for your situation and project.
Issue
- When using the Primefaces
<p:commandButton ajax="false" /> with p:dataExporter and p:fileDownload, the page will not render properly, there will be visual issues.
Environment
Resolution
- When using
p:dataExporter and p:fileDownload in portlets, it is a best practice to put them in their own separate form. Non-Ajax UICommand components will fail in JSF portlets if they are included in a form with a p:dataExporter or p:fileDownload.
Something like the below:
<h:body>
<h:form>
<p:commandButton value="commandButton ajax=false doesn't work" ajax="false" />
</h:form>
<h:form>
<h1>not working example - contains PrimeFaces dataExporter</h1>
<p:dataTable id="tabledata" var="r" value="#{controller.tabledata}">
<h:outputText value="this is the header where the button was" />
<p:commandButton ajax="false" value="csv export">
<p:dataExporter target="tabledata" type="csv" fileName="tabledata" />
</p:commandButton>
</f:facet>
<p:column>
<h:outputText value="#{r}" />
</p:column>
</p:dataTable>
<p:commandLink value="switch to working example" action="working" />
</h:form>
Shall be changed to become:
<h:body>
<h:form>
<p:commandButton value="commandButton ajax=false doesn't work" ajax="false" />
<h1>not working example - contains PrimeFaces dataExporter</h1>
<p:dataTable id="tabledata" var="r" value="#{controller.tabledata}">
<h:outputText value="this is the header where the button was" />
<p:commandButton ajax="false" value="csv export">
<p:dataExporter target="tabledata" type="csv" fileName="tabledata" />
</p:commandButton>
</f:facet>
<p:column>
<h:outputText value="#{r}" />
</p:column>
</p:dataTable>
<p:commandLink value="switch to working example" action="working" />
</h:form>
Did this article resolve your issue ?