DataTable - Edit Data displayed on datatable can be edited at row or cell level.
Row Editing
IdYearBrandColor
de824ede
1972
Audi
Silver
33e09336
1961
Audi
Yellow
42e7f172
1986
Renault
Orange
7d9f8d27
1978
Jaguar
Yellow
0ae91795
1968
Volkswagen
Green
0008fbdd
2004
Renault
Silver
61dd1970
2003
Renault
Orange
abf8ddf4
1966
Honda
Blue
daaff4ac
1978
Renault
Black
dc938b62
1992
Jaguar
Brown
Cell Editing with Click and RightClick
IdYearBrandColor
665f2764
2006
Volkswagen
Orange
a5801b32
2001
Jaguar
Yellow
d1cbe8e9
1972
Honda
Orange
19ddd1e2
1961
Mercedes
Black
a80ccf79
1966
Renault
White
ced36ad8
1966
Honda
Yellow
b660500c
1962
BMW
White
f438f70a
2007
Volvo
Silver
68cecb53
1962
Audi
Brown
09d62323
2003
Volkswagen
Blue
<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 © 2017
All rights reserved.
Running PrimeFaces-6.2-SNAPSHOT on Mojarra-2.3.2.