I have dataTable with row editing, but i dont need to edit one of my cells (user.username). How can i do this in primefaces? Is this possible? I try remove p:cellEditor for one cell but it does not work on my tablet because when I use this in a DataTable, this column is empty.
Thanks!
my code:
<h:form id="form">
<p:growl id="messages" showDetail="true" />
<p:contextMenu for="dataTable">
<p:menuitem value="Delete" update="dataTable" icon="ui-icon-close"
actionListener="#{userMB.deleteUser}" />
</p:contextMenu>
<p:dataTable id="dataTable" var="user" styleClass="DataTableUsers"
value="#{userMB.userList}" paginator="true" rows="5"
rowKey="#{user.user_id}" selection="#{userMB.selectedUser}"
selectionMode="single" filteredValue="#{userMB.filteredUsers}"
editable="true"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15">
<p:ajax event="rowEdit" immediate="true" listener="#{userMB.onEdit}"
update=":form:messages, :form:dataTable" process="#this" />
<p:column sortBy="name" filterBy="name" id="name" headerText="Name">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{user.name}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{user.name}" required="true"
requiredMessage="Please Enter Name"
validatorMessage="Name is too short!">
<f:validateLength minimum="2"></f:validateLength>
</p:inputText>
</f:facet>
</p:cellEditor>
</p:column>
<p:column sortBy="surname" filterBy="surname" headerText="Surname">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{user.surname}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{user.surname}" required="true"
requiredMessage="Please Enter Surname!"
validatorMessage="Surname is too short!">
<f:validateLength minimum="2"></f:validateLength>
</p:inputText>
</f:facet>
</p:cellEditor>
</p:column>
<p:column sortBy="username" filterBy="username"
headerText="Index number">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{user.username}" />
</f:facet>
<f:facet name="input">
<h:inputText value="#{user.username}" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column sortBy="userDescription" filterBy="userDescription"
headerText="descript">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{user.userDescription}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{user.userDescription}" required="true"
requiredMessage="Please Enter User Description" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column style="width:6%" headerText="Edit">
<p:rowEditor />
</p:column>
<f:facet name="footer">
<p:commandButton value="New User" oncomplete="newUserDialog.show()"
icon="ui-icon-star" title="Creates new user" />
</f:facet>
</p:dataTable>
</h:form>
Just change the component that holds the user.username value to <h:outputText>
<h:outputText value="#{user.username}" />
and you will have the value read-only.
Related
So I am trying to use a PrimeFaces data table to set data to a list as follows;
<h:form id="frmSalarySupplement">
<p:panel>
<p:dataTable id="tblSalarySupplement"
value="#{salSupplementMB.dataListFromDB}"
var="salSupp"
rowIndexVar="rowSn"
scrollable="true"
rows="10"
paginator="true"
editable="true"
editMode="cell"
rowsPerPageTemplate="10,20,50,100">
<p:ajax event="cellEdit"
listener="#{salSupplementMB.onCellEdit}"
update="#this" />
<p:column headerText="#" escape="false"
style="white-space:pre-line;
word-break:break-all;
width:20px;
text-align:center;">
<h:outputText value="#{rowSn+1}" />
</p:column>
<p:column headerText="Name"
style="white-space:pre-line;
word-break:break-all;
width:250px;">
<h:outputText value="#{salSupp.empId.name}" />
</p:column>
<p:column headerText="Designation"
style="white-space:pre-line;
word-break:break-all;
width:150px;">
<h:outputText value="#{salSupp.empId.designation.designationName}" />
</p:column>
<p:column headerText="Allowance"
style="white-space:pre-line;
word-break:break-all;
width:100px;">
<p:cellEditor>
<f:facet name="input">
<h:inputText value="#{salSupp.allowance}"
style="width:100%" />
</f:facet>
<f:facet name="output">
<h:outputText value="#{salSupp.allowance}" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Special
Allowance"
style="white-space:pre-line;
word-break:break-all;
width:100px;">
<p:cellEditor>
<f:facet name="input">
<h:inputText value="#{salSupp.specialAllowance}"
style="width:100%" />
</f:facet>
<f:facet name="output">
<h:outputText value="#{salSupp.specialAllowance}" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Transport
Allowance"
style="white-space:pre-line;
word-break:break-all;
width:100px;">
<p:cellEditor>
<f:facet name="input">
<h:inputText value="#{salSupp.transportAllowance}"
style="width:100%" />
</f:facet>
<f:facet name="output">
<h:outputText value="#{salSupp.transportAllowance}" />
</f:facet>
</p:cellEditor>
</p:column>
</p:dataTable>
</p:panel>
</h:form>
So I want to be able to save the data I have edited on the cell to set it on the list. When I do the following, I don't get an updated value.
public void onCellEdit(CellEditEvent event) {
Object oldValue = event.getOldValue();
Object newValue = event.getNewValue();
}
Can someone suggest what shall I do with it?
Update
Also, can anyone tell me why my table loads multiple times when I edit the value? Maybe that's what's giving me the problem.
I have a datatable element where I use a rowEditor. Additionally it is possible to add a new record which is implemented as inputFields in the footer of the table. All elements are validated. The problem is, that when a user hits the rowEditor the validation complains that the values for a new record are not set.
How can I avoid that the new record fields are being validated when the rowEditor is clicked?
I fiddled around a bit with proccess & immediate on the ajax events but I'm not able to figure this out. Is this possible and if yes, how? I'm thankful for help.
<p:dataTable var="contact"
value="#{data.activeCustomer.contacts.toArray()}"
id="contactsTable"
emptyMessage="#{ivy.cms.co('/Translations/Administration/noRecordsFoundSearch')}"
editable="true">
<p:ajax event="rowEdit" listener="#{logic.onEdit(contact)}" />
<p:ajax event="rowEditCancel" listener="#{logic.onCancel}" />
<f:facet name="header">
#{ivy.cms.co('/Translations/Administration/Contacts/labelContacts')}
</f:facet>
<p:column
headerText="#{ivy.cms.co('/Translations/Administration/Contacts/prename')}">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{contact.prename}" />
</f:facet>
<f:facet name="input">
<p:inputText required="true"
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterPrename')}"
value="#{contact.prename}"></p:inputText>
</f:facet>
</p:cellEditor>
<f:facet name="footer">
<p:inputText required="true"
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterPrename')}"
value="#{data.contactPrename}" />
</f:facet>
</p:column>
<p:column
headerText="#{ivy.cms.co('/Translations/Administration/Contacts/surname')}">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{contact.surname}" />
</f:facet>
<f:facet name="input">
<p:inputText required="true"
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterSurname')}"
value="#{contact.surname}"></p:inputText>
</f:facet>
</p:cellEditor>
<f:facet name="footer">
<p:inputText required="true"
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterSurname')}"
value="#{data.contactSurname}" />
</f:facet>
</p:column>
<p:column
headerText="#{ivy.cms.co('/Translations/Administration/Contacts/phone')}">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{contact.phone}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{contact.phone}"
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterPhone')}"
required="true"></p:inputText>
</f:facet>
</p:cellEditor>
<f:facet name="footer">
<p:inputText
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterPhone')}"
required="true" value="#{data.contactPhone}" />
</f:facet>
</p:column>
<p:column
headerText="#{ivy.cms.co('/Translations/Administration/Contacts/email')}">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{contact.email}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{contact.email}" required="true"
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterEmail')}">
<f:validator validatorId="EmailValidator" />
</p:inputText>
</f:facet>
</p:cellEditor>
<f:facet name="footer">
<p:inputText required="true"
requiredMessage="#{ivy.cms.co('/Translations/CustomerAdministration/Validation/enterEmail')}"
value="#{data.contactEmail}">
<f:validator validatorId="EmailValidator" />
</p:inputText>
</f:facet>
</p:column>
<p:column style="width: 6%"
headerText="#{ivy.cms.co('/Translations/CustomerAdministration/actionsColumnTitle')}">
<p:rowEditor />
<p:commandLink styleClass="ui-icon ui-icon-trash"
actionListener="#{logic.deleteContact(contact)}"
icon="ui-icon-trash" update=":#{p:component('contactForm')}"
immediate="true" />
<f:facet name="footer">
<h:commandButton
value="#{ivy.cms.co('/Translations/Administration/Contacts/ButtonAddContact')}"
actionListener="#{logic.addContact}" />
</f:facet>
</p:column>
</p:dataTable>
</h:form>
I have a datatable like this. But it would not export the headers to excel :
<h:form id="formOptionList">
<p:dataTable id="OptionTable"
var="Options"
widgetVar="OptionTable"
value="#{managedBean.options}"
filteredValue="#{managedBean.filteredOptions}"
emptyMessage="No Options found."
rendered="#{managedBean.userPreferences.showTable}"
paginator="true"
rows="10"
paginatorTemplate="{FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="20,50,100"
>
<p:column id="id" headerText="ID" filterBy="id" filterMatchMode="exact" width="12%" rendered="#{managedBean.userPreferences.showID}" >
<h:outputText value="#{options.optionID}" />
</p:column>
....
....
</p:dataTable>
<h:panelGrid columns="1">
<p:panel header="Export All Data">
<h:commandLink>
<p:graphicImage value="../resources/images/menuicons/options.png" />
<p:dataExporter type="xls" target="OptionTable" fileName="Options" />
</h:commandLink>
</p:panel>
</h:panelGrid>
</h:form>
So I changed it to
<p:column id="id" filterBy="id" filterMatchMode="exact" width="12%" rendered="#{managedBean.userPreferences.showID}" >
<f:facet name="header>">
<h:outputText value="Option ID"/>
</f:facet>
<h:outputText value="#{Options.OptionID}" />
</p:column>
And I still don't see the headers in the excel file. Any ideas ?
Headers are not shown in exported excel file from primefaces datatable
Try this:
<p:column id="id" filterBy="#{Options.OptionID}" filterMatchMode="exact" width="12%" rendered="#{managedBean.userPreferences.showID}" >
<f:facet name="header>">
<h:outputText value="Option ID"/>
</f:facet>
<h:outputText value="#{Options.OptionID}" />
</p:column>
You put a <h:outputText value= ""/> after your </f:facet> ?
<p:column>
<f:facet name="header">
<h:outputText value="Your Column Name" />
</f:facet>
<h:outputText value="Your value" />
</p:column>
You can put a new column with display none, from the existing column just put an exporter false
<p:column id="id" filterBy="# Options.OptionID}"filterMatchMode="exact" width="12%" rendered="#anagedBean.userPreferences.showID}"exporter="false">
<f:facet name="header>">
<h:outputText value="Option ID" />
</f:facet>
<h:outputText value="#{Options.OptionID}" />
</p:column>
Add new column with display none and remove all sorting,filtering and rendering
<p:column exporter="true" style="display:none;">
<f:facet name="header>">
<h:outputText value="Option ID"/>
</f:facet>
<h:outputText value="#{Options.OptionID}" />
</p:column>
This works perfectly.
Below is code of xhtml page,
even i put dialog in a form or not i can see outputtexts below of the page.
I am running into such situation for the first time.
<h:form id="form">
<h:outputLabel value="Welcome #{loginBean.name}"></h:outputLabel>
<p:dataTable id="cars" var="book" value="#{indexView.mediumBooksModel}" paginator="true" rows="10"
selection="#{indexView.selectedBook}" rowKey="">
<f:facet name="header">
RadioButton Based Selection
</f:facet>
<p:column selectionMode="single" style="width:2%" />
<p:column headerText="Title" style="width:25%">
#{book.title}
</p:column>
<p:column headerText="ISBN" style="width:25%">
#{book.isbn}
</p:column>
<p:column headerText="Year" style="width:24%">
#{book.year}
</p:column>
<p:column headerText="Price" style="width:24%">
#{book.price}
</p:column>
<f:facet name="footer">
<p:commandButton id="viewButton" value="View" icon="ui-icon-search"
update=":displaySingle" oncomplete="singleBookDialog.show()"/>
</f:facet>
</p:dataTable>
</h:form>
<p:dialog id="dialog" header="Book Detail" widgetVar="singleBookDialog" resizable="false"
modal="true" >
<h:panelGrid id="displaySingle" columns="2" cellpadding="4">
<f:facet name="header">
<p:graphicImage value="/images/books/#{indexView.selectedBook.image}.jpg"/>
</f:facet>
<h:outputText value="Title:" />
<h:outputText value="#{indexView.selectedBook.title}" style="font-weight:bold"/>
<h:outputText value="Year:" />
<h:outputText value="#{indexView.selectedBook.year}" style="font-weight:bold"/>
<h:outputText value="ISBN:" />
<h:outputText value="#{indexView.selectedBook.isbn}" style="font-weight:bold"/>
<h:outputText value="Price:" />
<h:outputText value="#{indexView.selectedBook.price}" style="font-weight:bold"/>
</h:panelGrid>
</p:dialog>
I'm working with Primefaces.My functionality is to display the records in a datatable with primefaces inline editing .Here we have an "Add" button which displays a dialog to enter new record.After entering the values and click on "Save" button,the record is inserted and the datatable is updated with the record.
My problem is, when i click on "Add" button for the second time the dialog box is not opening.Here is my code.
<h:form id="myForm" prependId="false">
<p:dataTable var="client" id="clientTable" value="#{clientView.clientModelList}" paginatorPosition="top" paginator="true" rows="10"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="10,20,25" rowEditListener="#{clientView.rowEditListener}" onRowEditUpdate="growl" >
<p:column style="width:60px;">
<p:rowEditor/>
<h:commandButton style="padding-left:5px;" image="/resources/images/delete.jpeg" styleClass="spa" value="delete" immediate="true" actionListener="#{clientView.delete}" >
<f:attribute name="username" value="#{client}" />
</h:commandButton>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{myLoginBean.multilangMap['everis.client.idCliente']}" />
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{client.codCliente}" />
</f:facet>
<f:facet name="input">
<h:inputText required="true" requiredMessage="#{msg.idClienteEmpty}" maxlength="80" value="#{client.codCliente}" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{myLoginBean.multilangMap['everis.client.desCliente']}" />
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{client.desCliente}" />
</f:facet>
<f:facet name="input">
<h:inputText required="true" requiredMessage="#{msg.desClienteEmpty}" maxlength="255" value="#{client.desCliente}" />
</f:facet>
</p:cellEditor>
</p:column>
</p:dataTable>
</div>
<div class="divButPosition">
<h:panelGroup id="buttonPanel">
<p:commandButton id="buttons" value="Add" actionListener="#{clientView.addEmptyClient}"
async="true" update="buttonPanel,dlgForm:table" rendered="#{!clientView.addNewRow}" oncomplete="alert('complete');clientDialog.show();" />
</h:panelGroup>
</div>
</h:form>
<p:growl id="growl" showDetail="false" />
<p:dialog id="clientDialog" header="Client Detail" widgetVar="clientDialog" resizable="false" width="500" showEffect="explode" hideEffect="explode" modal="false" closable="false">
<h:form id="dlgForm" >
<h:dataTable var="newclient" id="table" value="#{clientView.newClient}">
<h:column>
<f:facet name="header">
<h:outputText value="#{myLoginBean.multilangMap['everis.client.idCliente']}" />
</f:facet>
<h:inputText value="#{newclient.codCliente}" required="true" requiredMessage="#{msg.idClienteEmpty}" maxlength="80"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="#{myLoginBean.multilangMap['everis.client.desCliente']}" />
</f:facet>
<h:inputText value="#{newclient.desCliente}" required="true" requiredMessage="#{msg.desClienteEmpty}" maxlength="255"/>
</h:column>
</h:dataTable>
<p:commandButton value="everis.save" actionListener="#{clientView.saveClient}" async="true" update="growl,buttonPanel,clientTable" oncomplete="handleRequest(args ,document.getElementById('clientDialog'))" />
<p:commandButton value="#{myLoginBean.multilangMap['everis.cancel']}" immediate="true" update="buttonPanel,table" async="true" actionListener="#{clientView.cancelClient}" oncomplete="clientDialog.hide();" />
</h:form>
</p:dialog>
Thanks alot for every one.
Now correct me if i'm wrong, but if you click save on the dialog you never close it? I won't know if it will help but you can try atleast