When I use just plain h:dataTable:
<h:dataTable var="office"
value="#{reportController.data}" width="100%"
id="titleRpt" styleClass="data" border="1" cellpadding="2"
columnClasses="none,rightAlign,rightAlign,rightAlign,rightAlign,rightAlign,rightAlign,rightAlign"
headerClass="tableHeader"
rowClasses="oddRow,evenRow"
cellspacing="0" rendered="#{reportController.doDisplay and reportController.reportType eq 'T'}">
I get the following output:
However, once I change h:dataTable to p:dataTable (same code except for the p), I get the following:
How do I get PrimeFaces to automatically set the column widths based on the data within (which is dynamic and retrieved from the DB)? I am using the smoothness theme.
The reason I have to go with the PrimeFaces version and not the plain JSF one is because I need to have data export functionality and p:dataExporter requires that it be nested inside a p:dataTable and not an h one.
Related
I need to display components and data dynamically. Below code I am trying to populate list of select boxes. Trying to populate values from var within forEach.
<c:forEach items="${bean.dynamicParamsBean.editableComoBoxes}" var="editableComboBox">
<h:selectOneMenu value="#{editableComboBox.param}">
<f:selectItems value="#{editableComboBox.dataProvider}" />
</h:selectOneMenu>
</c:forEach>
This works fine except f:selectItems where my select box is not populating any data. editableComboBox.dataProvider returns list of SelectItem objects.
This exact code works fine if I don't use loop and in turn var, directly populating select box values by referencing to bean.
Is there any workaround and alternative to resolve this issue?
I have a situation here. I am using prime faces 2.2 where i am showing a data-table on a screen after pulling data from database and displaying the same on data-table. i have 80 columns to retrieve from database but only showing few of them on data-table due to screen size constraints. But while exporting the data-table to excel, i need to export all the 80 columns. Please advise how can we do this the easiest way..Thanks.
One way which we used is have those column as part of datatable definition and then hide them from client side. That way, they are still part of the meta data for datatable, but not visible on the UI. Here is how we did.
<p:column headerText="Group Name" width="0" styleClass="vd-hidden-column">
<h:outputText value="#{managedbean.groupName}" />
</p:column>
Then, we applied the CSS for .vd-hidden-column as below.
.vd-hidden-column {
display: none;
width: 0;
height: 0;
}
Voila. The columns is hidden on the UI. But, they will be part of your excel/csv export.
I have datatable with multiple checkbox selection (PF 3.3.1). I've defined column:
<p:column selectionMode="multiple"/>
I would like add some text or icon to header and I tried with headerText column attribute and with facet:
<f:facet name="header">
<h:outputText value="Header text" />
</f:facet>
But it doesn't work.
It is possible to modify header of checkbox selection column?
In case you want that feature badly and don't mind to use jquery, You could do something like
I tested it on primefaces shocase and it works (run these command at the console)
$("<span class='someClass'>Hellow</span>").insertAfter($('#form\\:multiCars thead tr:eq(2) th').find('.ui-chkbox-box'))
note that #form\\:multiCars should be changed with your table id
and tr:eq(2) refers to the third row in the table , cause in showcase the row with the headers is third
to change the width of that selection column you can use
$($('#form\\:multiCars thead tr:eq(2) th')[0]).css('width',100)
I'm aware of the fact that its waaaay ugly , but it works :)
Also you will have to run this script after each ajax rendering of the table
I am using rich faces data table tag in my jsf:
<r:dataTable id="dataTable" var="user" preserveDataModel="false"
value="#{ListUsersManagedBean.users}" rows="10"
rowId="#{user.firstName}" rowKeyVar="index"
width="500" style="float:centre" reRender="ds" columnClasses="center">
Here i have configured rowsize as 10 in static way.I want to give the user a dropdown in the table so he can select number of rows 100,200,300,400 etc below the column.How can i do this.Or any better solution?
Thanks
You can do that by binding a variable to rows like rows = #{yourBean.noOfRows} and same to the combo box, and reRender your datatable onChange of comboBox.
This can be done if you are strict to use <rich:dataTable> or you can use jQuery datatable easy to integrate and easy to use for the functionality you need.
<h:dataTable width="100%" border="1" cellspacing="0"
cellpadding="2" style="border-collapse:collapse;display:block"
styleClass="Header" value="#{adminBean.displayResults}"
var="aResult" binding="#{adminBean.browseResultsHTMLDataTable}">
This is what i am trying to do. I have a dynamic list of data, which i try to display in the HTML Table format using h:dataTable (the bounded value is an arrayList). The table has got a radio button for each row it displays (boolean w/ h:selectOneRadio ) now when i select the radio button in one of these rows, i want to get the values of the row that is selected for which i try to use binding attribute. But i get Row Unavailable exception - is my approach wrong? any suggestions?
Selecting rows by radio button in a datatable is a tricky task since the radio buttons aren't grouped. Long story short: Select row by radio button.
I think you can use <t:selectOneRadio> with layout="spread" and then <t:radio> on each row.