I am using JSF 2.1 and primefaces 3.5. Let's say I have a following code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Web application</title>
</h:head>
<h:body>
<h1>Editor</h1>
<h:form>
<p:wizard>
<p:tab title="Edit">
<h2>Edit:</h2>
<p:dataTable value="#{editorBean.applications}" var="app">
<p:column headerText="Id">
<p:inplace emptyLabel="Value not assigned" editor="true" effectSpeed="fast">
<p:inputText value="#{app.id}" />
</p:inplace>
</p:column>
<p:column headerText="Name">
<p:inplace emptyLabel="Value not assigned" editor="true" effectSpeed="fast">
<p:inputText value="#{app.name}" required="true" />
</p:inplace>
</p:column>
</p:dataTable>
</p:tab>
<p:tab title="Summary">
<h2>Summary:</h2>
<p:dataTable value="#{editorBean.applications}" var="app">
<p:column headerText="Id">#{app.id}</p:column>
<p:column headerText="Name">#{app.name}</p:column>
</p:dataTable>
</p:tab>
</p:wizard>
</h:form>
</h:body>
</html>
When I press next on the wizard, and validation fails (application name is blank) then all inplaces included on the page are toggled to editor mode.
I think that they shouldn't be toggled since validation for each input is performed when you accept editor for this input.
It looks awful, especially that I have a lot of inplaces.
I would like to disable toggling of each inplace editor when validation fails. Does anyone have an idea of how to solve this problem?
That's because of p:inplace component is not made for this usage purpose. There are few other components makes problems when used in data tables like inplace but for your requirement this can be useful:
<p:column headerText="Year" style="width:25%">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{car.year}" /></f:facet>
<f:facet name="input"><p:inputText value="#{car.year}" style="width:96%" label="Year"/></f:facet>
</p:cellEditor>
</p:column>
You can check the full example from primefaces showcase.
Related
I am trying to emulate the Primefaces Showcase to have a result set that uses filtering and a row expansion. I get errors whenever I try either one. The page loads without errors. In the code example, I have stripped the filtering to isolate the issue. It appears that any time an AJAX request is triggered it will give an error. The error is triggered when trying to use the row expansion as that uses an AJAX call to fetch the expanded row.
We are using Primefaces 8.0 on IBM Rad local server (Eclipse). Result set is pulled from DB2 using Hibernate and that part works.
Please help by suggesting why the AJAX fails everytime?
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
</h:head>
<h:body>
<ui:composition template="/template/maintemplate.xhtml">
<ui:define name="title">Search Results</ui:define>
<ui:define name="content">
<h:form id="formId">
#{searchResultsBean.init}
<p:dataTable id="parameterList" var="data"
value="#{searchResultsBean.parameterList}">
<p:column style="width:16px">
<p:rowToggler />
</p:column>
<p:column value="#{data.companyId}" >
<f:facet name="header">
<h:outputText value="Company ID" />
</f:facet>
<h:outputText value="#{data.companyId}" />
</p:column>
<p:column value="#{data.companyName}" >
<f:facet name="header">
<h:outputText value="Company Name" />
</f:facet>
<h:outputText value="#{data.companyName}" />
</p:column>
<p:column value="#{data.alertNumber}">
<f:facet name="header">
<h:outputText value="Alert Number" />
</f:facet>
<h:outputText value="#{data.alertNumber}" />
</p:column>
<p:column value="#{data.comment}">
<f:facet name="header">
<h:outputText value="Comment" />
</f:facet>
<h:outputText value="#{data.comment}" />
</p:column>
<p:rowExpansion>
<p:panelGrid columns="2" columnClasses="label,value"
style="width:300px">
<h:outputText value="Company ID" />
<h:outputText value="#{data.companyId}" />
<h:outputText value="Company Name" />
<h:outputText value="#{data.companyName}" />
<h:outputText value="Alert #" />
<h:outputText value="#{data.alertNumber}" />
<h:outputText value="Alert Description" />
<h:outputText value="$#{data.alertNumber}" />
</p:panelGrid>
</p:rowExpansion>
</p:dataTable>
</h:form>
</ui:define>
</ui:composition>
</h:body>
</html>
Error received in console:
ReferenceError: ajaxWaitCursorOn is not defined
Specific error in primefaces generated javascript:
$(function(){PrimeFaces.cw("AjaxStatus","widget_j_id878804506_56ad391e",{id:"j_id878804506_56ad391e",delay:0,start:function(){ajaxWaitCursorOn()},success:function(){ajaxWaitCursorOff()}});});
Note 1: We tried changing it to use #Inject instead of calling the init method and got the same result.
Note 2: We verified that jQuery is loaded using a simple alert in the console.
The issue was this line above: template="/template/maintemplate.xhtml
It was loading a template file. We didn't make this, but copied it from another project. The template file had this line in for some reason: <p:ajaxStatus onstart="ajaxWaitCursorOn()" onsuccess="ajaxWaitCursorOff()" />
I am not sure if this answer provides value to anyone except for this: Check your template files if you have any.
Some basic information:
- Primefaces Version: 5.3
- Primefaces Extension Version: 3.1.0
- Java Server Faces: 2.0
I try to display a editable table but somehow the rows aren't displayed properly - you don't see any value but if you click the text input field appears with the right value which is weird...
The xhtml file
I deleted some things from the source (replaced with -)
<ui:composition template="WEB-INF/views/templates/userTemplate.xhtml" xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions">
<ui:define name="content">
<p:dataTable id="dataTable" var="oe" rowKey="#{oe.id}" value="#{showSomethingMgdBean.allUser}" lazy="true" editable="true" editMode="cell" widgetVar="cellCars">
<p:column headerText="id" style="text-align: center;">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{oe.id}" />
</f:facet>
<f:facet name="input">
<p:inputText id="modelInput" value="#{oe.id}" style="width:96%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="-">
<h:outputText value="#{oe.-}" />
</p:column>
<p:column headerText="-">
<h:outputText value="#{oe.-}" />
</p:column>
<p:column headerText="-">
<h:outputText value="#{oe.-}" />
</p:column>
<p:column headerText="-">
<h:outputText value="#{oe.-}" />
</p:column>
<p:column headerText="enabled">
<h:outputText value="#{oe.enabled}" />
</p:column>
<p:column headerText="expired">
<h:outputText value="#{oe.expired}" />
</p:column>
<p:column headerText="locked">
<h:outputText value="#{oe.locked}" />
</p:column>
<p:column>
<p:rowEditor />
</p:column>
</p:dataTable>
</ui:define>
</ui:composition>
If you need more informations let me know. Maybe it's because of my the xhtml / jsf declaration at the beginning of the file?
<ui:composition template="WEB-INF/views/templates/userTemplate.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions">
I had the css and javascript files of prime-ui integrated aswell as the primefaces things in tomcat so i guess the prime-ui files had the other files overwritten and therefor i couldnt use some features of primefaces or atleast it was messing with the css. So i deleted all custom css things like #Kukeltje mentioned in the comments and it worked! :D
This question already has answers here:
java.lang.NoClassDefFoundError: org/apache/poi/ss/usermodel/RichTextString at org.primefaces.component.export.ExporterFactory.getExporterForType
(2 answers)
Closed 7 years ago.
I got these error message while click the export button in the sever. I can't convert that table.
I used primeface 5.0 and netbeans 8.0.2 version and GlassFish server 4.1
How can i solve this problem?
This is my home.xhtml file.
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Facelet Title</title>
</h:head>
<h:body>
<h:form>
<p:dataTable value="#{linkController.links}" var="lis" rowKey="#{lis.link_id}" selectionMode="single" id="tbl">
<p:column headerText="Id">
<f:facet name="header"></f:facet>
#{lis.link_id}
</p:column>
<p:column headerText="name">
#{lis.link_name}
</p:column>
<p:column headerText="date">
#{lis.date}
</p:column>
<p:column headerText="time">
#{lis.time}
</p:column>
<p:column headerText="uplink">
#{lis.upLink}
</p:column>
<p:column headerText="downlink">
#{lis.downLink}
</p:column>
</p:dataTable>
<p:commandButton value="Save as excel">
<p:dataExporter type="xls" target="tbl" fileName="kananee" pageOnly="true" />
</p:commandButton>
</h:form>
</h:body>
</html>
The error is self-explanatory, and confirmed in the Primefaces manual:
For pdf exporting itext and for xls exporting poi libraries are
required in the classpath.
So here you go: https://poi.apache.org/download.html
I'm trying to add a contextMenu to a dataTable contained inside a tab. I have been able to get the menu to show up on a dataTable which is not inside a tab and was also to get it to show up on the entire tab...but not specifically on the dataTable.
I've tried several different references in the 'for' attribute of the contextMenu...some blow up, some do not but the menu doesn't show up on right-click.
I'm using PrimeFaces 4.0. Any suggestions?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:p="http://primefaces.org/ui">
<h:head></h:head>
<h:body>
<h:form id="someForm">
<p:tabView id="tv" var="tb" value="#{TempBeans.tabs}">
<p:ajax event="tabClose" listener="#{TempBeans.tabClose}"
update="#form" />
<p:tab id="tempTab" title="#{tb.name}" closable="true">
<p:dataTable id="dTable" var="d" value="#{tb.dtbs}">
<p:column id="column1" headerText="name">
<h:outputText value="#{d.name}" />
</p:column>
<p:column id="column2" headerText="id">
<h:outputText value="#{d.id}" />
</p:column>
</p:dataTable>
</p:tab>
</p:tabView>
<p:contextMenu for=":someForm:tv:dTable">
<p:menuitem value="TableView" update="#form" icon="ui-icon-search" />
<p:menuitem value="TableDelete" update="#form" icon="ui-icon-close" />
</p:contextMenu>
</h:form>
</h:body>
</html>
Well, I was able to get the context menu to appear by changing the table to be selectable...which is sort of what I wanted anyway. However, now I have another problem...If I make the selectionMode "multiple" and use ctrl-clicks to select rows it seems to register the last right-click as a single click.
click one row
ctrl-click second row
ctrl-click third row
right-click one of the rows...deselects other rows
So it seems I would have to force my users to:
click one row
ctrl-click second row
ctrl-right-click third row
AAAAAAAAAAAAAAAAAAAAAAAAAAARRRRGH!! Deal-breaker...looks like I'm going back to prehistoric ui times and implementing multiple selection with checkboxes.
Please someone tell me I'm wrong and there's a simple way to make it not behave like this.
Anyway, here is how I eventually managed to get a contextMenu to show up:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:p="http://primefaces.org/ui">
<h:head></h:head>
<h:body>
<h:form id="someForm">
<p:tabView id="tv" var="tb" value="#{TempBeans.tabs}">
<p:ajax event="tabClose" listener="#{TempBeans.tabClose}" update="#form" />
<p:tab id="tempTab" title="#{tb.name}" closable="true">
<p:dataTable id="dTable" var="d" value="#{tb.dtbs}" selection="#{tb.selectedDTBs}" selectionMode="multiple" rowKey="#{d.name}">
<p:column id="column1" headerText="name">
<h:outputText value="#{d.name}" />
</p:column>
<p:column id="column2" headerText="id">
<h:outputText value="#{d.id}" />
</p:column>
</p:dataTable>
<p:contextMenu id="cMenuId" for="dTable">
<p:menuitem value="TableView" update="#form" icon="ui-icon-search" />
<p:menuitem value="TableDelete" update="#form" icon="ui-icon-close" />
</p:contextMenu>
</p:tab>
</p:tabView>
</h:form>
</h:body>
</html>
When I select a row in my primefaces datatable the row highights, but the selection event is not being invoked and the selected row data is not going to it. Also I notice that my eclipse debugger seems to just hang with PrimeFaces, anyone else notice this? Below is my .xhtml.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
>
<h:head>
<h:outputStylesheet library="css" name="table-style.css" />
</h:head>
<h:body>
<center>
<p:dataTable var="user" value="#{customer.getCustomerList()}"
selection="#{customer.selectedCustomer}" selectionMode="single"
rowSelectListener="#{custmoer.onUserSelect}" onRowSelectUpdate="userUpdateForm"
onRowUnselectUpdate="userUpdateForm"
paginator="true" rows="5" rowKey="#{user.customerID}" >
<p:column>
<f:facet name="header">
<h:outputText value="Id" />
</f:facet>
<h:outputText value="#{user.customerID}" />
</p:column>
<p:column >
<f:facet name="header">
<h:outputText value="Name" />
</f:facet>
<h:outputText value="#{user.name}" />
</p:column>
<p:column >
<f:facet name="header">
<h:outputText value="Address" />
</f:facet>
<h:outputText value="#{user.address}" />
</p:column>
</p:dataTable>
<p:inputText id="userUpdateForm" value="#{customer.selectedCustomer.name}" />
</h:form>
</center>
</h:body>
your onXXX attributes are bound to opaque strings, when they're supposed to be bound to javascript fragments (either a method call or a fragment that executes some code). i'm guessing javascript is throwing an exception, and nothing gets sent to the server because execution in the browser halts.
Put the <p:datatable> into a <h:form> component.
May be this is only a missing <h:form> start tag in your post (the </h:form> end tag is included). But forgetting to wrap a data posting component into a <h:form> is a common mistake which leads to the symptoms described by you.
Seems the problem was IE9. Problem disappeared with Firefox.
This can happen if there is another issue in the data table for example in my case the table is editable but I did not add editMode attribute after I added it selection also started working.