<p:ajax> Unable to attach <p:ajax> to non-ClientBehaviorHolder parent

Question

I use JSF 2 , primefaces 4.0 and i try to use DataTable - In-Cell Editing as it's produced in primefaces showcase, but i have an error althought i copied the same example shown in showcase the error is

<p:ajax> Unable to attach <p:ajax> to non-ClientBehaviorHolder parent

this is the xhtmlpagecode

 <rich:panel  style="width : 800px; height : 551px; " > 
     <f:facet name="header" >

<h:outputText value="Tableau des articles" align="center" style="FONT-SIZE: small;"/>
            </f:facet>


    <h:form id="form">

   <p:dataTable id="cars" var="car" value="#{articlesbean.LMatpilotaccess1}" editable="true" editMode="cell" widgetVar="carsTable">  

        <f:facet name="header">  
            Matériel du pilotage et accessoires 
        </f:facet>  
  <p:growl id="messages" showDetail="true"/>  

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


        <p:column headerText="Serie" style="width:25%">  
               <p:ajax event="cellEdit" listenner="#{articlesbean.onCellEdit}" update=":form:messages" /> 

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



    </p:dataTable>  


    </h:form>




</rich:panel>

and this is my bean

@ManagedBean(name="articlesbean")

@ViewScoped
public class ArticlesBean implements Serializable{

    @Inject
    private ArticlesDAO articleDAO;
    @Inject
    private Matpilotaccess1 matpilotaccess1;
    @Inject
    private Matpilotaccess2 matpilotaccess2;
    @Inject
    private Poteaux poteaux ;
    @Inject
    private Travgc1 travgc1;
    @Inject
    private Travgc2 travgc2;
    @Inject
    private Travresurbain travresurbain;


    private List LMatpilotaccess1 = new ArrayList();
    private List LMatpilotaccess2 = new ArrayList();
    private List LPoteaux = new ArrayList();
    private List LTravgc1 = new ArrayList();
    private List LTravgc2 = new ArrayList();
    private List LTravresurbain = new ArrayList();




    public void onCellEdit(CellEditEvent event) {  
        Object oldValue = event.getOldValue();  
        Object newValue = event.getNewValue();  

        if(newValue != null && !newValue.equals(oldValue)) {  
            FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Cell Changed", "Old: " + oldValue + ", New:" + newValue);  
            FacesContext.getCurrentInstance().addMessage(null, msg);  
        }  
    } 

    //// Getters and setters

Answer 1

You nested the <p:ajax> inside a <p:column>. The <p:ajax> requires to be nested in a component implementing the ClientBehaviorHolder interface. However, the Column component class behind <p:column> does not implement it. The DataTable component class behind <p:dataTable> implements it.

You should be nesting <p:ajax> inside <p:dataTable> instead:

<p:dataTable ...>
   <p:ajax ... /> 

   <p:column ...>
       ...
   </p:column>
</p:dataTable>

Exactly as demonstrated on their showcase site. In other words, your statement

althought i copied the same example shown in showcase

is actually not true.