i have one form inside the form i have one datatable and one chart so i need to export both in either PDF or excel file, i am using following command for export data
<h:form id="contenForm">
<!-- chart -->
<p:chart type="bar" model="#{dataModel.barModel}" id="barChart" />
<!-- Datatable -->
<p:dataTable value="#{dataModel.list}" var="loc" width="100%" paginator="true"
id="tableResulta" paginatorPosition="bottom" tableStyle="margin:0 auto; width:100%" rendered="#{not empty dataModel.list}">
<p:column>
<f:facet name="header">
<h:outputText value="Surname" />
</f:facet>
<h:outputText value="#{loc.surname}" />
</p:column>
<!-- and other colume-->
</p:dataTable>
<!-- Export button -->
<h:panelGrid columns="2" rendered="#{not empty dataModel.list}">
<h:commandLink immediate="true">
<p:commandButton value="Export excel" immediate="true" />
<p:dataExporter type="xls" target="barChart,tableResulta" fileName="formInformation" />
</h:commandLink>
<h:commandLink immediate="true">
<p:commandButton value="Export PDF" immediate="true" />
<p:dataExporter type="pdf" target="barChart,tableResulta" fileName="formInformation" />
</h:commandLink>
</h:panelGrid>
</h:form>
i have tried above code but not able to export both when i export only datatable then its work properly.
so please help me how can i export chart and datatable into signle file?
thanks in advances.
You just can't, not without creating a complex custom exporter... Sidenote: I think a real reporting tool is in the end a much better fit...
Related
I need to export datatable row expansion in primefaces but i cannot figure it out. Is there anyway to do that ?
Thanks in advance.
You can export PrimeFaces DataTable with rowExpansion data without an other Java API or you can use custom export method on ManagedBean class with Apache POI API help.
Here trick is, add the columns which to be exporting to the file and append the visible=”false” attribute to the these columns.
Then append the exportable=”false” attribute to the p:rowToggler column.
Thus, you won’t see datatable columns but you will see these columns on the exported file.
Obtained from here
<h:form id="myDtTblFrm">
<h:commandLink>
<img src="../ims/excel.png"/>
<p:dataExporter type="xlsx" target="myTbl" fileName="myExcelFile"/>
</h:commandLink>
<p:dataTable id="myTbl" var="item" value="#{myBean.list}">
<p:rowExpansion>
<p:panelGrid columns="2" columnClasses="label, value" style="width: 50%">
<h:outputText value="Column Header 04" />
<h:outputText value="#{item.property04}" />
<h:outputText value="Column Header 05" />
<h:outputText value="#{item.property05}" />
</p:panelGrid>
</p:rowExpansion>
<p:column exportable="false">
<p:rowToggler />
</p:column>
<p:column headerText="Colum01">
<p:outputLabel value="#{item.property01}" />
</p:column>
<p:column headerText="Column02" visible="false" >
<p:outputLabel value="#{item.property02}" />
</p:column>
<p:column headerText="colum03" >
<p:outputLabel value="#{item.property03}" />
</p:column>
<p:column headerText="colum04" style="display: none">
<p:outputLabel value="#{item.property04}" />
</p:column>
<p:column headerText="colum05" style="display: none">
<p:outputLabel value="#{item.property05}" />
</p:column>
</p:dataTable>
I've got a JSF page with <rich:tabPanel> which contains 4 tabs.
On the 4th tab I'm trying to use <a4j:commandButton> to execute the action and render resulTable.
Here is the shorten example
<rich:tab header="Journal">
<h:form id="filterForm">
<a4j:jsFunction name="submitByEnter"
action="#{smsLogList.refresh}" render="smsTable" />
<s:div id="divSearch">
<rich:collapsiblePanel header="#{messages['search']}"
switchType="client">
<h:panelGrid column="1">
<s:decorate template="/layout/edit.xhtml">
<ui:define name="label">Package number</ui:define>
<h:inputText id="packNum" style="width:200px"
value="#{smsLogList.packNum}">
<a4j:ajax event="keyup" listener="#{smsLogList.refresh}"
ignoreDupResponses="true" requestDelay="1500"
render="smsTable" />
</h:inputText>
</s:decorate>
<!---some other search elements-->
<s:div styleClass="actionButtons">
<a4j:commandButton id="search" value="#{messages['search']}"
render="smsTable" action="#{smsLogList.go}" />
<a4j:commandButton id="reset" value="#{messages['clear']}"
onclick="document.getElementById('filterForm').reset();"
action="#{smsLogList.clear}" render="divSearch,smsTable" />
</s:div>
</h:panelGrid>
</rich:collapsiblePanel>
</s:div>
<!--- results table-->
<h:panelGrid id="smsTable">
<s:div>
<rich:dataTable value="#{smsLogList.resultList}" var="sms"
id="table" rendered="#{not empty smsLogList.resultList}">
<rich:column>
<f:facet name="header">Type</f:facet>
<h:outputText value="#{sms.smsType}" />
</rich:column>
<!---- some other columns-->
</rich:dataTable>
<rich:dataScroller for="table" />
</s:div>
</h:panelGrid>
</h:form>
</rich:tab>
So, when I'm clicking on the <a4j:commandButton> - nothing happens, but if I'm switching to the other tab and back - the result is as necessary.
I tried to change a4j to <h:commandButton>, but after it's pressed the page switches to the first tab.
Is any solution how to work this out?
The solution is quite simple.
I used <h:form> inside other <h:form>. It will not work anyway. When I remove internal - the jsf works smooth and as it should.
I'm currently working with primeface's p:rowExpansion and noticed that it's not working inside a p:outputPanel. Here's a sample code:
<p:commandButton action="#{xxxSearchBean.search()}" value="Search" update="messages resultPanel" styleClass="button"></p:commandButton>
<p:outputPanel id="resultPanel">
<p:panel rendered="#{xxxSearchBean.hasResults()}">
<ui:include src="xxxSearchView.xhtml">
<ui:param name="searchBean" value="#{xxxSearchBean}" />
</ui:include>
</p:panel>
</p:outputPanel>
The included view:
<p:accordionPanel activeIndex="0">
<p:tab title="Criminal Results">
<p:dataTable var="c" value="#{searchBean.results}">
<p:column style="width:16px">
<p:rowToggler />
</p:column>
<p:column headerText="Last Name">
<h:outputText value="#{c.lastname}" />
</p:column>
<p:column headerText="First Name">
<h:outputText value="#{c.firstname}" />
</p:column>
<p:rowExpansion>
<p:panelGrid columns="4"
columnClasses="form-field-label,value,form-field-label,value">
<h:outputText value="Label" />
<h:outputText value="Value" />
</p:panelGrid>
</p:rowExpansion>
</p:dataTable>
</p:tab>
</p:accordionPanel>
The above code successfully show the result grid when there are results, but when I click the rowExpansion it doesn't work.
When I moved out the panel and remove the rendered property, the row expansion worked. But I don't want to show the grid on page load :-(
Any idea?
I don't know if <p:rowExpansion> really doesn't work with <p:outputPanel>. But since you don't need any special features of <p:outputPanel>, you can just use <h:panelGroup> instead. :)
I was able to solved the problem by changing the backing bean annotation from #Model to #Conversation scope, then start the conversation the moment the view is render.
Hello guys I have a problem with my datatable I want to filter it, but if i put something into the text field nothing is shown and also if i clear the input also nothing.
It is possible if i have more than one statment in a column?
So I use primefaces 3.5 and jsf 2.1
Here is the code and if you need more code post an comment. thx
<p:dataTable id="inboxTable" var="task" value="#{taskboxBean.taskboxInboxList}" paginator="true"
widgetVar="inboxTable" rows="10" selection="#{taskboxBean.selectedTaskbox}"
selectionMode="single" rowKey="#{task.ID}" emptyMessage="" paginatorPosition="bottom"
filteredValue="#{taskboxBean.inboxList}">
<p:ajax event="rowSelect" update=":contentForm, :postForm:tabViewPosts:inboxTable"
listener="#{taskboxBean.onTaskboxRowSelect}" />
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Suchen:" />
<p:inputText id="globalFilter" onkeyup="inboxTable.filter()"
style="margin-left:5px;width:150px" />
</p:outputPanel>
</f:facet>
<p:column headerText="Post">
<h:outputText
value="#{task.FROM_USER.FIRST_NAME} #{task.FROM_USER.LAST_NAME} (#{task.FROM_USER.EMAIL})" />
<div align="right">
<h:panelGroup rendered="#{!task.IS_SEEN}" class="fa fa-envelope fa-2x" />
<h:panelGroup rendered="#{task.IS_SEEN}" class="fa fa-envelope-o fa-2x" />
</div>
<h:outputText value="#{task.TASKTYPE.NAME}" />
<br />
<h:outputText value="#{task.CREATE_TIMESTAMP}" />
</p:column>
</p:dataTable>
It is not explicitely written in documentation, but as mentioned on PrimeFaces forum, you need to declare filterBy attribute on columns you want to make searchable via global filter.
It is also suggested here to add filterStyle="display:none" to columns if you don't want a filter to be visible on individual columns.
The example from documentation has filterBy:
<p:dataTable var="car" value="#{carBean.cars}"
filteredValue="#{carBean.filteredCars}" widgetVar="carsTable">
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Search all fields:" />
<h:inputText id="globalFilter" onkeyup="carsTable.filter()" />
</p:outputPanel>
</f:facet>
<p:column filterBy="#{car.model}" headerText="Model" filterMatchMode="contains">
<h:outputText value="#{car.model}" />
</p:column>
</p:dataTable>
however, as typical for PrimeFaces documentation, it's not written that it won't work without filterBy.
You must add getter and setter of your taskboxInboxList in the taskboxBean class. But it filters just the first statement placed in the column.
I have a requirement where I want the user to move the datatable rows up and down.I thought Context Menu would come handy as there would be a Move up and Move down menu item .For this I tried implementing the context Menu for datatable example from Primefaces Showcase. However I am not getting the selected values from the datatable rows to be displayed on the dialog.
Please find the below code:
<p:contextMenu for="availableCars">
<p:menuitem value="View" update="display" icon="ui-icon-search" oncomplete="carDialog.show()"/>
</p:contextMenu>
<p:dataTable id="availableCars" var="car" value="#{RequestBean.formFields}" rowKey="#{car.car_group}" selectionMode="single" selection="#{RequestBean.selectedField}">
<p:column headerText="Field Label">
<h:outputText value="#{car.car_label}" />
</p:column>
<p:column headerText="Field Group">
<h:outputText value="#{car.car_group}" />
</p:column>
<p:column headerText="Field Name">
<h:outputText value="#{car.car_name}" />
</p:column>
</p:dataTable>
<p:dialog header="Car Detail" widgetVar="carDialog" resizable="false"
width="200" showEffect="clip" hideEffect="fold" id="dialog">
<h:panelGrid id="display" columns="2" cellpadding="4">
<h:outputText value="Car label:" />
<h:outputText value="#{RequestBean.selectedField.car_label}" style="font-weight:bold"/>
<h:outputText value="car Group" />
<h:outputText value="#{RequestBean.selectedField.car_group}" style="font-weight:bold"/>
<h:outputText value="Car Name:" />
<h:outputText value="#{RequestBean.selectedField.car_name}" style="font-weight:bold"/>
</h:panelGrid>
</p:dialog>
Any help would be appreciated.
N.B: I am using PF 2.2.1
It looks like the selection doesn't get sent using ajax - you need to set the onRowSelectUpdate attribute on the data table.
From Primefaces documentation:
In both single and multiple selection options described before, enclosing form needs to be submitted
by user so that the selections would be processed and set to the selection value reference. If you’d
like to execute custom logic whenever the row is selected instantly bind a rowSelectListeneror or define onRowSelectUpdate option.