Update datatable primefaces

Question

I am making an application which consisting of a task manager.

In this task manager there are 3 list (inbox, today and week) in the inbox list only appear task without category and in the other two appear task with or without category for today and for the week respectively.

I want to be able to change the category of one task in the three list. So if I change the category of an inbox task (that should not have category) the whole table should be updated and the task should be removed from the list.

I debugg the program and the task is correctly removed from the list but only the cell of the category is updated and not the whole table. If I reload the page the task does not appear. Does someone know how to update the whole table and not only one cell? thanks.

Here is the code of my datatable (the cell that is modified is the last one with the "category" header):

<h:form id="formTareas">
    <p:dataTable id="tablaTareas" var="tarea" value="#{userBean.tasks}"
        border="1" selection="#{userBean.selectedTasks}"
        rowKey="#{tarea.id}" editable="true" editMode="cell"
        widgetVar="tasksTable" style="text-align: center" paginator="true"
        rows="8" filteredValue="#{userBean.filteredTasks}">

        <p:ajax event="cellEdit" listener="#{userBean.updateTask(tarea)}"
            process=":formTareas" update=":formTareas:tablaTareas" />

        <p:column selectionMode="multiple"
            style="width:16px;text-align:center" />

        <p:column>
            <f:facet name="header">#{msgs.comentario}</f:facet
            <h:outputText value="#{tarea.comments}" />
        </p:column>

        <p:column>
            <f:facet name="header">#{msgs.fechaCreacion}</f:facet>
            #{userBean.formatDate(tarea.created)}
        </p:column>

        <p:column id="columnaPlanned" sortBy="#{tarea.planned}">
            <f:facet name="header">#{msgs.fechaPlanificacion}</f:facet>
            <h:outputText value="#{tarea.planificada}" />
        </p:column>

        <p:column headerText="category">
            <p:cellEditor>
                <f:facet name="output">
                    <h:outputText
                        style="color : #{tarea.isRetarded() ? 'red' : 'black'};"
                        value="#{userBean.getCategoryName(tarea)}" />
                </f:facet>
                <f:facet name="input">
                    <h:selectOneMenu value="#{tarea.categoryId}" style="width:96%">
                        <f:selectItem itemLabel="Inbox" itemValue="" />
                        <f:selectItems value="#{userBean.categories}" var="c"
                            itemValue="#{c.id}" itemLabel="#{c.name}" />
                    </h:selectOneMenu>
                </f:facet>
            </p:cellEditor>

        </p:column>
    </p:dataTable>
</h:form>

why do you want to update the whole datatable, if the only information that changes is the column? — Billy DEKAR
@BillyHope because when I update that row the corresponding item in the list is removed (if the category != null the item must appear in other list). — ronce96
@BillyHope I have just edit the description in order to explain myself better. — ronce96
@BillyHope I have just found the answer to the question. Thank you anyway. — ronce96

ronce96 ronce96 · Accepted Answer · 2017-03-26T09:24:53

I have just found the answer to my question. I added these lines and the whole dataTable is updated:

<p:remoteCommand name="onCellEdit" update=":formTareas:tablaTareas" />
<p:dataTable id="tablaTareas" ........>
     <p:ajax event="cellEdit" listener="#{userBean.updateTask(tarea)}"
      oncomplete="onCellEdit()" />

This just worked fine for me.

Update datatable primefaces

1 Answers