Primefaces datatable, not updated after delete a row

Question

I'm trying deleting a row from my primefaces datatable but it never updates itself until I refresh the browser.

This is how I'm doing it:

<p:column headerText="Eliminar Usuario" rendered="#{user.current.tipo.equalsIgnoreCase('planta')}">
<p:commandButton  action="#{usuarios.eliminar(o.idUsuario)}" value="Eliminar" update="@form"/>
</p:column>

I've tried wrapping the datatable into an h:panelgroup, I also tried using update=":formUsuarios:users" (the id of my form is formUsuarios and the id of the table is users). I put "ajax="true" in the commandButton, nothing has worked.

I don't know what else to try. I'm using primefaces 3.5.

Here is my bean:

@ManagedBean(name = "usuarios")
@ViewScoped
public class UsuariosBean {
    @ManagedProperty(value="#{user}")
    private LoginBean loginBean;
    private List<UsuariosEntity> usuarios;
    UsuariosEntity user=new UsuariosEntity();
    private String nombre;
    private int activo;
    private String tipo;
    private String password;
    private String selection;
    private UIComponent mybutton;
    @PostConstruct
    public void init(){

        UsuariosEntity usuario=loginBean.getCurrent();
        usuarios=new ArrayList<UsuariosEntity>();
        if(usuario.getTipo().equalsIgnoreCase("Planta")){
        usuarios= UsuariosDAO.getALL();
        }else{
            usuarios= UsuariosDAO.getALLbyRol(usuario.getUsuario());
        }
    }

    public UIComponent getMybutton() {
        return mybutton;
    }

    public void setMybutton(UIComponent mybutton) {
        this.mybutton = mybutton;
    }

    public String getSelection() {
        return selection;
    }

    public void setSelection(String selection) {
        this.selection = selection;
    }

    public String getNombre() {
        return nombre;
    }

    public void setNombre(String nombre) {
        this.nombre = nombre;
    }

    public int getActivo() {
        return activo;
    }

    public void setActivo(int activo) {
        this.activo = activo;
    }

    public String getTipo() {
        return tipo;
    }

    public void setTipo(String tipo) {
        this.tipo = tipo;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public LoginBean getLoginBean() {
        return loginBean;
    }

    public void setLoginBean(LoginBean loginBean) {
        this.loginBean = loginBean;
    }

    public UsuariosEntity getUser() {
        return user;
    }

    public void setUser(UsuariosEntity user) {
        this.user = user;
    }

    public List<UsuariosEntity> getUsuarios() {
        return usuarios;
    }

    public void setUsuarios(List<UsuariosEntity> usuarios) {
        this.usuarios = usuarios;
    }
    public void newUsuario(){
        UsuariosEntity user=new UsuariosEntity();
        user.setIdPlanta(2);
        user.setActivo(this.activo);
        user.setPassword(this.password);
        user.setUsuario(this.nombre);
        user.setTipo(this.selection);

        List<UsuariosEntity>usuariox=UsuariosDAO.findbyname(this.nombre);

            if (usuariox.size()==0){
                UsuariosDAO.save(user);
            }else{
                FacesMessage message = new FacesMessage("El usuario ya existe en la base de datos");
                FacesContext context = FacesContext.getCurrentInstance();
                context.addMessage(mybutton.getClientId(context), message);
            }
    }

    public void eliminar(int id_user){
        UsuariosEntity user=UsuariosDAO.find(id_user);
        UsuariosDAO.eliminar(user);
    }



    public void onEdit(RowEditEvent event) {
        UsuariosDAO.save(((UsuariosEntity)event.getObject()));
        FacesMessage msg = new FacesMessage("Usuario Editado", ((UsuariosEntity) event.getObject()).getUsuario());

        FacesContext.getCurrentInstance().addMessage(null, msg);
    }

    public void onCancel(RowEditEvent event) {
        FacesMessage msg = new FacesMessage("Edición Cancelada", ((UsuariosEntity) event.getObject()).getUsuario());

        FacesContext.getCurrentInstance().addMessage(null, msg);
    }
}

the view:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"
                 xmlns:f="http://java.sun.com/jsf/core"
                 template="/Contenido/Template.xhtml"
                 xmlns:p="http://primefaces.org/ui">

 <ui:define name="page-content">


    <h:form id="formUsuarios">

        <p:growl id="messages" showDetail="true"/>
        <p:dataTable id="users" value="#{usuarios.usuarios}" var="o" editable="true"  scrollRows="20" scrollable="true" scrollHeight="150" paginator="true" rows="10"
                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                     rowsPerPageTemplate="5,10,15">

    <f:facet name="header">Usuarios</f:facet>
            <p:ajax event="rowEdit" listener="#{usuarios.onEdit}" update=":formUsuarios:messages" />
            <p:ajax event="rowEditCancel" listener="#{usuarios.onCancel}" update=":formUsuarios:messages" />

            <p:column headerText="#" style="width:6%">

        <h:outputText value=" #{o.idUsuario} "/>
    </p:column>

    <p:column  rendered="#{user.current.tipo.equalsIgnoreCase('planta')}" headerText="Nombre">
        <p:cellEditor>
            <f:facet name="output">
                <h:outputText value="#{o.usuario}" />
            </f:facet>
            <f:facet name="input">
                <p:inputText value="#{o.usuario}" style="width:100%"/>
            </f:facet>
        </p:cellEditor>
    </p:column>

    <p:column headerText="Nombre" rendered="#{user.current.tipo.equalsIgnoreCase('productor')||user.current.tipo.equalsIgnoreCase('exportadora')}">
        <h:outputText value="#{o.usuario}" />
    </p:column>

    <p:column rendered="#{user.current.tipo.equalsIgnoreCase('planta')}" headerText="Estado" style="width:6%">
        <p:cellEditor>
            <f:facet name="output">
                <h:outputText value="#{o.activo}" />
            </f:facet>
            <f:facet name="input">
                <p:inputText value="#{o.activo}" style="width:100%"/>
            </f:facet>
        </p:cellEditor>
    </p:column>
    <p:column headerText="Password">
        <p:cellEditor>
            <f:facet name="output">
                <h:outputText  value="********"  />
            </f:facet>
            <f:facet name="input">
                <h:inputSecret value="#{o.password}" style="width:100%"/>
            </f:facet>
        </p:cellEditor>
    </p:column>

    <p:column rendered="#{user.current.tipo.equalsIgnoreCase('planta')}" headerText="Tipo">
        <p:cellEditor>
            <f:facet name="output">
                <h:outputText value="#{o.tipo}" />
            </f:facet>
            <f:facet name="input">
                <p:inputText value="#{o.tipo}" style="width:100%"/>
            </f:facet>
        </p:cellEditor>
    </p:column>
            <p:column headerText="Editar" style="width:6%">
                <p:rowEditor />
            </p:column>
            <p:column headerText="Eliminar Usuario" rendered="#{user.current.tipo.equalsIgnoreCase('planta')}">

                <p:commandButton  actionListener="#{usuarios.eliminar(o.idUsuario)}" value="Eliminar" process="users" ajax="true"/>

            </p:column>

        </p:dataTable>

        <br/>
    </h:form>
        <h:form>
        <p:panelGrid id="grid" columns="3" rendered="#{user.current.tipo.equalsIgnoreCase('planta')}">
            <f:facet name="header">
                Crear Usuario
            </f:facet>
            <h:outputText value="Nombre"/>
         <h:inputText id="nombre" label="name" value="#{usuarios.nombre}" required="true" requiredMessage="Debe ingresar un nombre"/>
          <h:message for="nombre" style="color:red"/>
         <h:outputText value="Contraseña" />
         <h:inputText id="pass" label="pasw" value="#{usuarios.password}" required="true" requiredMessage="Debe ingresar una contraseña"/>
         <h:message style="color:red" for="pass"/>
        <h:outputText value="Tipo"/>

            <h:selectOneMenu id="select1" value="#{usuarios.selection}" onchange="submit();" required="true" requiredMessage="Debe seleccionar un tipo de usuario">
                <f:selectItem itemValue="Planta" itemLabel="Planta" />
                <f:selectItem itemValue="Exportadora" itemLabel="Exportadora" />
                <f:selectItem itemValue="Productor" itemLabel="Productor" />
            </h:selectOneMenu>

            <h:message style="color:red"  for="select1"/>
        <h:outputText value="Activo"/>

                <h:selectOneMenu id="select2" value="#{usuarios.activo}" onchange="submit();" required="true" requiredMessage="Debe seleccionar una opción ">
                    <f:selectItem itemValue="0" itemLabel="Inactivo" />
                    <f:selectItem itemValue="1" itemLabel="Activo" />
                 </h:selectOneMenu>
                <h:message style="color:red"  for="select2" />

            <f:facet name="footer">
            <h:commandButton value="Crear" id="mybutton"
                             binding="#{usuarios.mybutton}"
                             class="button" action="#{usuarios.newUsuario}">
            </h:commandButton>
            <h:message style="color:red"  for="mybutton" />
            </f:facet>
         </p:panelGrid>

    </h:form>

 </ui:define>
</ui:composition>

The table is in the same form as the button. Just use the tables id in the update flag. No form id needed — Przemek
Have you tried with ajax=false and on the method reload the list you fill the table with? And return to the same page? So you call elimination and return an empty string — Przemek

Danubian Sailor Danubian Sailor · Accepted Answer · 2013-07-02T07:08:50

Changing the collection referred by the value doesn't immediately affect data table because the values that are shown are stored by the filtered collection.

1) If you specify the filteredValue attribute, you should manually clear that collection after the data table content has changed, for example after deleting the row. After update on the data table, it should refresh the content.

2) You can call filter() on the dataTable widget (client-side API). It always works but it generates additional AJAX request.

Primefaces datatable, not updated after delete a row

1 Answers