DataTable - Edit Data displayed on datatable can be edited at row or cell level.
Row Editing
IdYearBrandColor
d4cf4a74
1962
Fiat
Black
28f04039
1986
Volkswagen
Green
d700ffb6
1985
Renault
Orange
793f4758
1990
Mercedes
Brown
bb357ab7
2003
Volvo
Blue
dc0e64e8
1972
Renault
Orange
1ab516c4
1974
Mercedes
Yellow
ed83b382
1961
Volvo
White
81a81777
1964
Ford
Blue
2b26bcb9
1960
Jaguar
Silver
Cell Editing with Click and RightClick
IdYearBrandColor
9477938d
1987
BMW
Green
b20a6370
2008
Renault
Red
52f9d659
2006
Volkswagen
Red
32be6590
1992
Volvo
Green
da013b00
1994
Jaguar
White
fc47c528
1977
Mercedes
Yellow
8cb6c56b
2006
Ford
Brown
13047fc5
1960
Mercedes
Red
d7db0694
1989
Audi
Green
d964a63b
2005
Renault
Green
<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.1.4 on Mojarra-2.2.10.