DataTable - Edit Data displayed on datatable can be edited at row or cell level.
Row Editing
IdYearBrandColor
aaf97c70
1972
Ford
Green
3268227b
2008
Audi
Silver
0eae4639
1983
Audi
Brown
e4a2840f
1996
Ford
Maroon
000a16eb
2000
Mercedes
Maroon
9d82f087
2003
Ford
White
3adef785
2000
Jaguar
Orange
06547990
2007
Volvo
Maroon
173de629
2001
Renault
Black
d1b762a4
2002
Ford
Silver
Cell Editing with Click and RightClick
IdYearBrandColor
6fdb777c
1989
Renault
Blue
76009300
1965
Volkswagen
Maroon
6350d578
1994
BMW
Maroon
6cd21f50
1976
Mercedes
Maroon
705530f9
2007
Mercedes
Red
c07b57dc
1995
Volkswagen
Brown
1b78ecf4
1969
Jaguar
White
df2b0ce2
1994
Fiat
Silver
71558ae0
1973
Mercedes
Black
18efb26e
1963
Jaguar
White
<h:form id="form">
   <p:growl id="msgs" showDetail="true"/>

   <p:dataTable id="cars1" var="car" value="#{dtEditView.cars1}" editable="true" style="margin-bottom:20px">
       <f:facet name="header">
           Row Editing
       </f:facet>

       <p:ajax event="rowEdit" listener="#{dtEditView.onRowEdit}" update=":form:msgs" />
       <p:ajax event="rowEditCancel" listener="#{dtEditView.onRowCancel}" update=":form:msgs" />

       <p:column headerText="Id">
           <p:cellEditor>
               <f:facet name="output"><h:outputText value="#{car.id}" /></f:facet>
               <f:facet name="input"><p:inputText id="modelInput" value="#{car.id}" style="width:100%"/></f:facet>
           </p:cellEditor>
       </p:column>

       <p:column headerText="Year">
           <p:cellEditor>
               <f:facet name="output"><h:outputText value="#{car.year}" /></f:facet>
               <f:facet name="input"><p:inputText value="#{car.year}" style="width:100%" label="Year"/></f:facet>
           </p:cellEditor>
       </p:column>

       <p:column headerText="Brand">
           <p:cellEditor>
               <f:facet name="output"><h:outputText value="#{car.brand}" /></f:facet>
               <f:facet name="input">
                   <h:selectOneMenu value="#{car.brand}" style="width:100%">
                       <f:selectItems value="#{dtEditView.brands}" var="man" itemLabel="#{man}" itemValue="#{man}" />
                   </h:selectOneMenu>
               </f:facet>
           </p:cellEditor>
       </p:column>

       <p:column headerText="Color">
           <p:cellEditor>
               <f:facet name="output"><h:outputText value="#{car.color}" /></f:facet>
               <f:facet name="input">
                   <h:selectOneMenu value="#{car.color}" style="width:100%">
                       <f:selectItems value="#{dtEditView.colors}" var="color" itemLabel="#{color}" itemValue="#{color}" />
                   </h:selectOneMenu>
               </f:facet>
           </p:cellEditor>
       </p:column>

       <p:column style="width:32px">
           <p:rowEditor />
       </p:column>
   </p:dataTable>

   <p:dataTable id="cars2" var="car" value="#{dtEditView.cars2}" editable="true" editMode="cell" widgetVar="cellCars">
       <f:facet name="header">
           Cell Editing with Click and RightClick
       </f:facet>

       <p:ajax event="cellEdit" listener="#{dtEditView.onCellEdit}" update=":form:msgs" />

       <p:column headerText="Id">
              <p:cellEditor>
                  <f:facet name="output"><h:outputText value="#{car.id}" /></f:facet>
                  <f:facet name="input"><p:inputText id="modelInput" value="#{car.id}" style="width:96%"/></f:facet>
              </p:cellEditor>
          </p:column>

          <p:column headerText="Year">
           <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>

       <p:column headerText="Brand">
           <p:cellEditor>
               <f:facet name="output"><h:outputText value="#{car.brand}" /></f:facet>
               <f:facet name="input">
                   <h:selectOneMenu value="#{car.brand}" style="width:100%">
                       <f:selectItems value="#{dtEditView.brands}" var="man" itemLabel="#{man}" itemValue="#{man}" />
                   </h:selectOneMenu>
               </f:facet>
           </p:cellEditor>
       </p:column>

       <p:column headerText="Color">
           <p:cellEditor>
               <f:facet name="output"><h:outputText value="#{car.color}" /></f:facet>
               <f:facet name="input">
                   <h:selectOneMenu value="#{car.color}" style="width:100%">
                       <f:selectItems value="#{dtEditView.colors}" var="color" itemLabel="#{color}" itemValue="#{color}" />
                   </h:selectOneMenu>
               </f:facet>
           </p:cellEditor>
       </p:column>
   </p:dataTable>

   <p:contextMenu for="cars2" widgetVar="cMenu">   
       <p:menuitem value="Edit Cell" icon="ui-icon-search" onclick="PF('cellCars').showCellEditor();return false;"/>  
       <p:menuitem value="Hide Menu" icon="ui-icon-close" onclick="PF('cMenu').hide()"/>  
   </p:contextMenu> 

</h:form>
                
PrimeTek, Copyright © 2015
All rights reserved.
Running PrimeFaces-6.1-SNAPSHOT on Mojarra-2.2.8.