I have an editable <p:dataTable> with <p:cellEditor> and I want to export the content of that table into PDF format using <p:dataExporter>.
I have included the itext 2.1.7 jar. I got the output in PDF but it shows the Object#toString() values of all <p:cellEditor> components like so:
org.primefaces.component.celleditor.CellEditor#1bd59e1
How do I export the output values of the <p:cellEditor> instead?
The <p:cellEditor> is indeed not recognized by the PrimeFaces standard data exporters.
I've previously reported this to the PF guys as issue 4013 with an example which not only mentions CellEditor, but also HtmlGraphicImage (we are using images to show boolean states, whose alt we'd like to show in PDF/XML/XLS/CSV reports).
First, create a new class which extends the standard PDFExporter like follows:
public class ExtendedPDFExporter extends PDFExporter {
#Override
protected String exportValue(FacesContext context, UIComponent component) {
if (component instanceof CellEditor) {
return exportValue(context, ((CellEditor) component).getFacet("output"));
}
else if (component instanceof HtmlGraphicImage) {
return (String) component.getAttributes().get("alt");
}
else {
return super.exportValue(context, component);
}
}
}
Then, to use it, call it programmatically instead of via <p:dataExporter>.
<p:dataTable binding="#{table}" editable="true" ...>
<p:column><p:cellEditor>...</p:cellEditor></p:column>
<p:column><p:cellEditor>...</p:cellEditor></p:column>
<p:column><p:cellEditor>...</p:cellEditor></p:column>
<p:column exportable="false"><p:rowEditor /></p:column>
</p:dataTable>
<h:commandLink value="PDF" action="#{bean.exportPDF(table, 'filename')}" />
With
public void exportPDF(DataTable table, String filename) throws IOException {
FacesContext context = FacesContext.getCurrentInstance();
Exporter exporter = new ExtendedPDFExporter();
exporter.export(context, table, filename, false, false, "UTF-8", null, null);
context.responseComplete();
}
Feel free to find the data table by UIComponent#findComponent() instead and to set the filename in action method only. The above code is just exemplary.
I agree, I also find this approach to customize the Exporter behaviour the most flexible and least painful.
Anyone interested in using the preProcessor/postProcessor methods with this? Here's an example how to do that.
I dared to slightly modify the method from the answer above:
public void exportPDF(DataTable table, String filename,
String preProcessor, String postProcessor) throws IOException {
FacesContext context = FacesContext.getCurrentInstance();
ExpressionFactory factory = context.getApplication().getExpressionFactory();
MethodExpression preProcessorME = factory.createMethodExpression(
context.getELContext(), preProcessor, null, new Class[] {Object.class});
MethodExpression postProcessorME = factory.createMethodExpression(
context.getELContext(), postProcessor, null, new Class[] {Object.class});
Exporter exporter = new ExtendedPDFExporter();
exporter.export(context, table, filename, false, false, "UTF-8",
preProcessorMe, postProcessorME);
context.responseComplete();
}
And this is how you use it in your page (again, I just modified the above example):
<p:dataTable binding="#{table}" editable="true" ...>
<p:column><p:cellEditor>...</p:cellEditor></p:column>
<p:column><p:cellEditor>...</p:cellEditor></p:column>
<p:column><p:cellEditor>...</p:cellEditor></p:column>
<p:column exportable="false"><p:rowEditor /></p:column>
</p:dataTable>
<h:commandLink value="PDF" action="#{bean.exportPDF(table, 'filename',
'#{yourBean.preProcessPDF}', '#{yourBean.postProcessPDF}')}" />
Notice that there ARE NO NESTED EL STATEMENTS (that is not allowed anyway), the last two arguments are simple Strings containing EL expressions.
Related
I'm trying to get a Primefaces 5.2 selectOneMenu to display images along with their filenames. This is what my xhtml currently looks like:
<h:form>
<h:panelGrid id="createPanelGrid" columns="2">
<p:outputLabel value="Service Logo:" />
<p:selectOneMenu value="#{imageBean.selectedImage}" var="l">
<f:selectItem itemLabel="Select a logo" itemValue="" />
<f:selectItems value="#{imageBean.imageList}" var="logo" itemLabel="#{logo}" itemValue="#{logo}" />
<p:column>
<p:graphicImage value="#{imageBean.imageFolder}/#{l}" style="max-width:50px;max-height:50px;" />
</p:column>
<p:column>#{l}</p:column>
</p:selectOneMenu>
</h:panelGrid>
The ManagedBean (imageBean) has
public List<String> getImageList () {
List<String> imageList = new ArrayList<String>();
File[] files = absoluteImageFolder.listFiles();
for (File file : files) {
imageList.add(file.getName());
}
return imageList;
}
and
private String selectedImage;
public String getSelectedImage() {
return selectedImage;
}
public void setSelectedImage(String selectedImage) {
this.selectedImage = selectedImage;
}
However, the images are not rendered on the webpage, just the filenames (I'd post a screenshot but I don't have enough reputation). I don't get two columns (first the image, then the filename), I just get the filename itself.
When I wrap the filename Strings into a POJO and use a converter it works - but just with Strings it doesn't.
How can I get this to work with just Strings?
This awkward behavior is confirmed by SelectOneMenuRenderer source code (line numbers match 5.2):
260 if(itemValue instanceof String) {
261 writer.startElement("td", null);
262 writer.writeAttribute("colspan", columns.size(), null);
263 writer.writeText(selectItem.getLabel(), null);
264 writer.endElement("td");
265 }
266 else {
267 for(Column column : columns) {
268 writer.startElement("td", null);
269 renderChildren(context, column);
270 writer.endElement("td");
271 }
272 }
So, if the item value is an instance of String, custom content via <p:column> is totally ignored. This does indeed not make any sense. The intuitive expectation is that the custom content is toggled by presence of var attribute and/or <p:column> children. You'd best report an issue to PrimeFaces guys to explain/improve this.
The work around, apart from providing non-String-typed item values, is to override the SelectOneMenuRenderer with a custom renderer which wraps the String in another object which happens to return exactly the same value in its toString(), such as StringBuilder. This way the renderer will be fooled that the values aren't an instance of String. Glad they didn't check for instanceof CharSequence.
public class YourSelectOneMenuRenderer extends SelectOneMenuRenderer {
#Override
protected void encodeOptionsAsTable(FacesContext context, SelectOneMenu menu, List<SelectItem> selectItems) throws IOException {
List<SelectItem> wrappedSelectItems = new ArrayList<>();
for (SelectItem selectItem : selectItems) {
Object value = selectItem.getValue();
if (value instanceof String) {
value = new StringBuilder((String) value);
}
wrappedSelectItems.add(new SelectItem(value, selectItem.getLabel()));
}
super.encodeOptionsAsTable(context, menu, wrappedSelectItems);
}
}
In order to get it to run, register it as below in faces-config.xml:
<render-kit>
<renderer>
<component-family>org.primefaces.component</component-family>
<renderer-type>org.primefaces.component.SelectOneMenuRenderer</renderer-type>
<renderer-class>com.example.YourSelectOneMenuRenderer</renderer-class>
</renderer>
</render-kit>
The reason is that Primefaces library is especting a bean in the var attribute of the selectOneMenu component, but you are giving String objects which are not beans . So the library doesn't render any column overlay at all. You will need a bean (wrapper) in the var attribute and the corresponding Converter in the converter attribute.
While performing CRUD operations using JSF/PrimeFaces, a common method that resets managed bean fields/properties is generally needed which is to be invoked basically after one such operation is successfully completed so that the fields in the backing bean are reset to their initial (default) value.
Imaginary code :
#Named
#ViewScoped
public class Bean extends LazyDataModel<Entity> implements Serializable {
#Inject
private Service service; // EJB.
// Holds a list of selected rows in a <p:dataTable>.
private List<Entity> selectedValues; // Getter & setter.
private String someField; // Getter & setter.
// Other fields depending upon the business requirement.
public Bean() {}
#PostConstruct
private void init() {
// Do something.
}
#Override
public List<Entity> load(int first, int pageSize, List<SortMeta> multiSortMeta, Map<String, Object> filters) {
setRowCount(service.rowCount());
// Other complex logic as and when required.
return service.getList(first, pageSize, map, filters); // Returns a List<Entity>.
}
// Resets fields to their default value.
public void reset() {
someField = null;
selectedValues = null;
// Reset other fields to their default value.
}
// Add (insert submitted values to the database).
// This method is basically bound to an action(Listener) of <p:commandButton>.
public void submit() {
if (service.insert(someField)) {
// Add a FacesMessge to indicate a success.
reset(); // Calling reset.
} else {
// Add a FacesMessge to indicate a failure.
}
}
// Update the database using submitted values.
public void onRowEdit(RowEditEvent event) {
if (event.getObject() instanceof Entity) {
Entity entity = (Entity) event.getObject();
Entity newEntity = service.update(entity);
if (newEntity != null) {
// Update the model.
// Other things like adding a FacesMessage to indicate a success.
} else {
// Add a FacesMessage to warn against the null entity returned by the service layer.
}
} else {
// Add a FacesMessage to indicate a failure.
}
reset(); // Finally reset the fields to their initial/default value.
}
// Similarly, performing the delete operation also requires to call the reset() method.
}
The submit() method performing "insert" is basically associated with JSF/PrimeFaces command components like <p/h:commandButton> or <p/h:commandLink>. Such as.
<p:inputText value="#{bean.someField}"/>
<p:commandButton value="Submit"
actionListener="#{bean.submit}"
oncomplete="if(args && !args.validationFailed) {updateTable();}"/>
<!-- Updating a p:dataTable in question after the above p:commandButton completes. -->
<p:remoteCommand name="updateTable" update="dataTable" process="#this"/>
The following AJAX events associated with a <p:dataTable> also require to call the reset() method.
<p:ajax event="rowEdit"
onstart="..."
oncomplete="..."
update="..."
listener="#{bean.onRowEdit}"/>
<p:ajax event="rowEditCancel"
onstart="..."
oncomplete="..."
update="..."
listener="#{bean.reset}"/>
<p:ajax event="page"
onstart="..."
oncomplete="..."
update="..."
listener="#{bean.reset}"/>
<p:ajax event="sort"
onstart="..."
oncomplete="..."
update="..."
listener="#{bean.reset}"/>
<p:ajax event="filter"
onstart="..."
oncomplete="..."
update="..."
listener="#{bean.reset}"/>
As can be seen, the reset() method needs to be memorized carefully as it is invoked from several places. The way is somewhat difficult to maintain.
Does there exist a way to invoke such a common method automatically after each POST request performing one of the CRUD operations has finished its job successfully?
JSF doesn't have any tag for this.
Ideally, you'd like to have something like a <f:event type="postInvokeAction" listener="#{bean.reset}"> directly attached to the <p:dataTable>. But that event doesn't exist in JSF 2.2. OmniFaces has one, but it's only supported on UIViewRoot, UIForm, UIInput and UICommand.
The <f:phaseListener> comes close, but it gets attached to UIViewRoot directly, even though you place it inside <p:dataTable>. And, it requires a whole PhaseListener implementation.
The <f:view afterPhase> seems your best bet. You only need some additional checking on the phase ID and the source component.
<p:dataTable binding="#{table}" ...>
<f:view afterPhase="#{bean.reset(table)}" />
<p:ajax ... />
<p:ajax ... />
<p:ajax ... />
<p:ajax ... />
...
</p:dataTable>
public void reset(UIData table) {
FacesContext context = FacesContext.getCurrentInstance();
if (context.getCurrentPhaseId() != PhaseId.INVOKE_APPLICATION) {
return;
}
String source = context.getExternalContext().getRequestParameterMap().get("javax.faces.source");
if (!table.getClientId(context).equals(source)) {
return;
}
// Reset logic here.
// ...
}
(binding could if necessary be replaced by a hardcoded table client ID)
I understand that this is awkward. So, for the upcoming OmniFaces 2.2 I have altered the existing InvokeActionEventListener to support this use case too. It now supports being attached on any UIComponent.
<p:dataTable ...>
<f:event type="postInvokeAction" listener="#{bean.reset}" />
<p:ajax ... />
<p:ajax ... />
<p:ajax ... />
<p:ajax ... />
...
</p:dataTable>
public void reset() {
// ...
}
I work with Primefaces 4-SNAPSHOT and I have some DataTables with <h:graphicImage> in them which I would like to export into different documents.
The fix that is desribed in p:dataExporter does not recognize p:cellEditor
which is supplied by BalusC works fine for the ExcelExporter, but does not work in the same way fot the CSVExporter.
I get NPE when I try to create the document.
I tried to remove the first lines of Code from the Extend-Class, because I have no CellEditor-Elements. This sort of works. It has no NPEs bus this gives me a document with the toString() of the graphicImage and the alt value.
The Extended-Class is this:
public class ExtendedCSVExporter extends CSVExporter
{
#Override
protected String exportValue(FacesContext context, UIComponent component)
{
if (component instanceof HtmlGraphicImage)
{
return (String) component.getAttributes().get("alt");
}
else
{
return super.exportValue(context, component);
}
}
}
And I call it like described in the referenced topic
public void exportPDF(DataTable table, String filename) throws IOException {
FacesContext context = FacesContext.getCurrentInstance();
Exporter exporter = new ExtendedCSVExporter();
exporter.export(context, table, filename, false, false, "UTF-8", null, null);
context.responseComplete();
}
The column of the Table looks like this:
<p:column sortBy="state">
<f:facet name="header">
<h:outputText value="State">
</f:facet>
<h:graphicImage id="stateImg" name="state.png" library="icons" value="#{bean.state} />
<p:tooltip for="stateImg" value="Allowed" showEffect="fade" hideEffect="fade" />
</p:column>
For the Excel export this works fine, and the value which is taken for the image is the value of the tooltip because the graphic image has no alt-value.
But this does not work for CSV files
What I get in my document for pageOnly is:
"javax.faces.component.html.HtmlGraphicImage#23e645d8AltText"
For the whole Table I get a NPE
Any suggestions how to fix this?
Okay I know have found a solution to my problem.
I just override the HtmlGraphicImage.
I modified the Extended-Class so the GraphicImage always returns an empty String and I fetch the value of the tooltip.
So the Extende-Class looks like this:
public class ExtendedCSVExporter extends CSVExporter
{
#Override
protected String exportValue(FacesContext context, UIComponent component)
{
if (component instanceof HtmlGraphicImage)
{
return "";
}
else
{
return super.exportValue(context, component);
}
}
}
I want to process this form (valueChangueListener is not valid in real case).
This is the back bean:
public class TestBean extends PrivateBaseBean implements Serializable {
private List<String> strings;
#PostConstruct
public void init() {
strings = new ArrayList<String>();
strings.add("");
strings.add("");
strings.add("");
}
public void saveAction(ActionEvent event) {
StringBuilder textToShowInMessage = new StringBuilder();
for (String string : strings) {
textToShowInMessage.append(string);
textToShowInMessage.append("; ");
}
FacesMessage msg = new FacesMessage(super.getBundle().getString(
textToShowInMessage.toString()), "");
FacesContext.getCurrentInstance().addMessage(null, msg);
}
getters... setters...
An the view:
....
<h:form>
<ui:repeat var="string" value="#{testBean.strings}">
<h:inputText value="#{string}" />
<br />
</ui:repeat>
<p:commandButton value="#{msg.save}"
actionListener="#{testBean.saveAction}" icon="ui-icon-disk"
update="#form" />
</h:form>
...
When the form is processed in the back bean string list always is blank.
How to process form intput's inside iteration, without any value changue listener?
There are some screenshots:
The same problem occurs with action or actionListener on
Your problem is not connected with PrimeFaces <p:commandButton>'s behaviour, but rather with a scoping problem that is implicilty created when using the <ui:repeat> tag.
First of all, let's depart from your example. Basically, you've got
<ui:repeat value="#{bean.strings}" var="s">
<h:inputText value="#{s}"/>
</ui:repeat>
with the backing List<String> strings.
The culprit is here: value="#{s}". The exported by <ui:repeat> variable s is visible only within its loop and it is not bound to any managed bean's property, but instead only to a local variable. Put it differently, s is not bound/equal to bean.strings[index] as one would expect and has no knowledge, as we see, where it originated from. So basically, you're off with a unilateral relationship: value from the bean is printed in your input properly, but the reverse is not happening.
The workarounds
Workaround #1: wrapper classes / model objects
The situation can be overcome by using a wrapper object for your class. In case of a string it could be a 'simple mutable string', like below:
public class MString {
private String string;//getter+setter+constructor
}
In this case the iteration will be working as predicted:
<ui:repeat value="#{bean.mstrings}" var="ms">
<h:inputText value="#{ms.string}"/>
</ui:repeat>
with the backing List<MString> mstrings.
Note that if you have your model class, like User, and will change its properties within <ui:repeat> the class itself will be effectively a wrapper, so that the properties will be set appropriately.
Workaround #2: chained property access
Another workaround consists of accessing an element of your collection directly from within a <h:inputText> tag. This way, any such property will be set by accessing the bean, then collection, then setting the property at the desired index. Excessively long, but that's how it is. As to the how question, <ui:repeat> provides for an exported current iteration status variable, varStatus, that will be used to access the array/collection in the managed bean.
In this case the iteration will also be working as predicted:
<ui:repeat value="#{bean.strings}" var="s" varStatus="status">
<h:inputText value="#{bean.strings[status.index]}"/>
</ui:repeat>
with the ordinary backing List<String> strings.
My workaround solution take the value directly from the page:
<ui:repeat id="repeat" value="#{bean.strings}" var="s" varStatus="status">
<h:inputText id="x" value="#{s.field}"/>
<h:commandLink style="margin: .5em 0" styleClass="commandLink" actionListener="#{bean.save(status.index)}" value="#{bundle.Send}"/>
</ui:repeat>
The save method:
public void save(String rowid) {
String jsParam = Util.getJsParam("repeat:" + rowid + ":x");
System.out.println("jsParam: " + jsParam); //persist...
}
The getJsParam method:
public static String getJsParam(String paramName) {
javax.faces.context.FacesContext jsf = javax.faces.context.FacesContext.getCurrentInstance();
Map<String, String> requestParameterMap = jsf.getExternalContext().getRequestParameterMap();
String paramValue = requestParameterMap.get(paramName);
if (paramValue != null) {
paramValue = paramValue.trim();
if (paramValue.length() == 0) {
paramValue = null;
}
}
return paramValue;
}
I have a problem with selecting rows in the Primefaces Datatable. I use dynamic columns, so the standard row selection mechanism is not usable here, I implement checkbox selection myself.
To help, here's s simplified version of what I have in my xhtml:
<h:form>
<p:dataTable id="table"
var="result"
value="#{tableBean.results}">
<p:columns value="#{tableBean.columnNames}" var="column" columnIndexVar="colIndex">
<f:facet name="header">
#{column}
</f:facet>
<h:panelGroup rendered="#{colIndex==0}">
<h:outputLabel>#{rowIndex}</h:outputLabel>
<h:selectBooleanCheckbox value="#{tableBean.selectedRows[result[0]]}"/>
</h:panelGroup>
</p:columns>
</p:dataTable>
<h:commandButton value="Submit"></h:commandButton>
</h:form>
And here's what I have in the managed bean to select the checkboxes:
package testpackage;
import java.util.*;
import javax.faces.bean.*;
#ManagedBean
#SessionScoped
public class TableBean
{
private Map<String, Boolean> selectedRows = new HashMap<String, Boolean>();
List<List<String>> results = new LinkedList<List<String>>();
public TableBean()
{
List<String> row1 = new LinkedList<String>();
List<String> row2 = new LinkedList<String>();
row1.add("row1.ref");
row1.add("row1.id");
row1.add("row1.status");
row2.add("row2.ref");
row2.add("row2.id");
row2.add("row2.status");
results.add(row1);
results.add(row2);
//selectedRows.put("row2.ref", true);
}
public Map<String, Boolean> getSelectedRows()
{
return selectedRows;
}
public String submit()
{
List<List<String>> selectedResults = new ArrayList<List<String>>();
for (List<String> result : results)
{
if (selectedRows.get(result.get(0)) != null)
{
selectedResults.add(result);
selectedRows.remove(result.get(0));
}
}
return null;
}
public List<List<String>> getResults()
{
return results;
}
public List<String> getColumnNames()
{
List<String> columnNames = new LinkedList<String>();
columnNames.add("");
columnNames.add("REF");
columnNames.add("ID");
columnNames.add("STATUS");
return columnNames;
}
}
The getSelectedRows method works great, but the problem is that the setSelectedRows method is never called, so I don't know which checkboxes the user has selected. Maybe I overlook something very trivial, but cannot find the solution.
Any ideas on this? I would be very glad if you helped, or give any other row selection solution for the dynamic columns.
Thx in advance,
Levi
To me it looks you are rendering the wrong field in selectBooleanCheckBox.
You should be using variable or field from the result variable.
My solution:
In your situation you are rendering an object from List as a form of table row so if you want to make some changes and retrieve the status of that row then you should be using the variable from that object only.
I understand you are submitting the whole form and want to pickup all updated rows, in that case you will have to loop through the whole List and find all the rows which have been updated by checking the status in Request Handler(Action) bean.
Hope that helps.
The setter is never called for nested objects. You're the one who's responsible for creating them, not JSF. JSF just gets the nested object and then calls the setter on it (which is the put() method in case of a Map). You just need to determine the selected rows in the action method. Add an action method to the commandbutton:
<h:commandButton value="Submit" action="#{bean.submit}"></h:commandButton>
which is definied like follows (guessing/assuming that var="result" is in essence an Object[]):
public String submit() {
List<Object[]> selectedResults = new ArrayList<Object[]>();
for (Object[] result : results) {
if (selectedRows.get((String) result[0])) {
selectedResults.add(result);
selectedRows.remove(result[0]); // Reset.
}
}
// Now selectedResults contains all selected results.
}