3

Intento refrescar el componente dataTabale de primefaces cuando elimino un registro de la tabla, sin embargo, cuando hago click en el boton de eliminar, a veces la tabla se actualiza y a veces no, entonces, tengo que manualmente refrescar la pagina completa para ver el cambio en el componente dataTable.

He notado algo curioso, cada vez que vuelvo a subir la aplicación al servidor(wildfly 8.2) y empiezo por el 4 registro(Hulk), el componente dataTable se actualiza inmediatamente, si empiezo por el primner o ultimo registro, tengo que presionar mcuhas veces el boton Delete, hasta que se refresque el componente.

Registro que se desea eliminar.introducir la descripción de la imagen aquí

Registro eliminadointroducir la descripción de la imagen aquí

  <h:form id="form">
        <p:dataTable id="studentsDataTable"
                     value="#{studentsController.students}"
                     var="student"
                     rowKey="#{student.username}"
                     selection="#{studentsController.studentSelected}"
                     selectionMode="single">

            <!--Header-->
            <f:facet name="header">
                Spanish Academy : Students' List
                <p:button value="Add Student" outcome="new_student" />
            </f:facet>

            <p:column headerText="Username">
                <h:outputText value="#{student.username}" />
            </p:column>
            <p:column headerText="Firstname">
                <h:outputText value="#{student.firstname}" />
            </p:column>
            <p:column headerText="Lastname">
                <h:outputText value="#{student.lastname}" />
            </p:column>
            <p:column headerText="Edit" style="width:50px">

            </p:column>
            <!--Footer-->
            <f:facet name="footer">
                <p:commandButton value="Delete" actionListener="#{studentsController.deleteStudent}"  icon="ui-icon-close" process="@form" update=":form:studentsDataTable"/>
                <p:spacer height="5px;"/>
            </f:facet>
        </p:dataTable>

    </h:form>

StudentController(ManagedBean) - Capa Web/Presentacion

 Named
@ApplicationScoped
public class StudentsController implements Serializable {

@EJB
private StudentService studentService;

private List<Student> students;

private Student studentSelected;

@PostConstruct
public void init() {
    students = studentService.getAllStudents();
    studentSelected = new Student();
}

public void deleteStudent() {
    studentService.deleteStudent(this.studentSelected);
    this.studentSelected = null;
    //List update
    this.init();
}

public StudentService getStudentService() { return studentService; }

public void setStudentService(StudentService studentService) { 
this.studentService = studentService; }

}

EJB(servicios) - Capa de Negocios

@Stateless
public class StudentServiceImpl implements StudentService {

@Inject
private StudentDao studentDao;

...

@Override
public void deleteStudent(Student student) { 
studentDao.remove(student); }
}

EJB(Dao) - Capa de Acceso de Datos

@Stateless
public class StudentDaoImpl implements StudentDao {

...
    @Override
    public void remove(Student student) {
        for (Student studentInDB: StudentsDB.students) {
            if(student.getUsername().equals(studentInDB.getUsername())) {
                StudentsDB.students.remove(studentInDB);
            }
        }
    }
}

Base de datos estatica

public class StudentsDB {
public static List<Student> students;

static {
    Student student;
    students = new ArrayList<>();

    student = new Student("Snake", "John", "Smith");
    students.add(student);
    student = new Student("Cowboy", "George", "Lopez");
    students.add(student);
    student = new Student("Batman", "Luis", "Williams");
    students.add(student);
    student = new Student("Hulk", "Miguel", "Woods");
    students.add(student);
    student = new Student("Prime", "Jeniffer", "Fierro");
    students.add(student);
}
}

Modelo Student(Java Bean Simple)

public class Student {

private String username;
private String firstname;
private String lastname;
private Date birthDate;
private String country;
private String city;
private String street;
private Integer zipCode;
private Integer phoneNumber;
private String email;
private boolean acceptTerms;

public Student() { }

public Student(String username, String firstname, String lastname) {
    this.username = username;
    this.firstname = firstname;
    this.lastname = lastname;
}
...
<!-- getters & setters -->
}

He intentado de muchas formas, solventarlo, sin embargo, no he podido hasta ahora, he leido, otros problemas similares al mio, sin embargo, no me han funcionado.

https://stackoverflow.com/questions/19548838/updating-entire-pdatatable-on-complete-of-pajax-event-celledit/19927578#19927578

Problema al actualizar componente datatable de primefaces

Incluso habia hecho la pregunta en stackoverflow en ingles y me han dado algunos consejos, pero no me han funcionado.

https://stackoverflow.com/questions/51026263/primefaces-datatable-is-not-updated-after-async-partial-submit-request-with-tag?noredirect=1#comment89106346_51026263

Alguna idea?

Gracias por adelantado.

2
  • ¿Podrías agregar el código mas relevante del método "deleteStudent"? En principio, el xhtml se ve correcto. ¿Son muchos registros en total o solo esos 4? el 27 jun. 2018 a las 16:39
  • @AlejandroGiorgi gracias por tu tiempo, he agregado el codigo relevante al metodo de borrado de un registro. Basicamente la pequena aplicacion esta basada en una arquitectura multicapa (capa presentacion o web, capa de negocios y capa de acceso de datos). En la capa de presentacion JSF con primefaces utiliza el patron MVC, por lo que view serial students.xhtml, el controlador StudentController y el modelo el Java Bean simple de Student. el 27 jun. 2018 a las 17:12

2 respuestas 2

3

Finalmente despues de buscar durante varios dias, posibles soluciones, llegue a la conclusion que podria ser un problema de PrimeFaces, sin embargo, encontre que el componente collector, es ideal para realizar las 4 operaciones CRUD (insertar, leer, actualizar y eliminar) de manera rapida y con menos codigo.

En el siguiente enlace se muestra un ejemplo de la pagina oficial de primefaces utilizando este componente.

Ejemplo de un DataTable componente de Primefaces en accion

De esta forma con un modelo MVC, es muy sencillo implementar la logica insertar, leer, actualizar y eliminar elementos de la tabla.

Espero que esta informacion le sea a alguien de ayuda. Adjunto el repositorio en Github de como implemente el componente. Como veran, el cosigo es mucho menor, ya que decide hacer un refactor de todo y cambiar de una arquitectura Multicapa a un diseno sencillo MVC.

Aplicacion MVC con JSF y PrimeFaces

1

Hola yo tuve ese problema y fue por el init() en lugar de consultar nuevamente la lista en PostConstruct cree otro método ejemplo:

public void consultaStudent() {
    students = studentService.getAllStudents();
    studentSelected = new Student();
}

public void deleteStudent() {
    studentService.deleteStudent(this.studentSelected);
    this.studentSelected = null;
    //List update
    consultaStudent();
}

o prueba mandando a llamar la consulta en el mismo método para descartar esta opción.

public void deleteStudent() {
    studentService.deleteStudent(this.studentSelected);
    this.studentSelected = null;
    //List update
    students = studentService.getAllStudents();
    studentSelected = new Student();
}

Modifica el update del commandButton de la siguiente forma actualizando el componente directamente:

<p:commandButton value="Delete" actionListener="#{studentsController.deleteStudent}"  icon="ui-icon-close" update=":#{p:component('studentsDataTable')}"/>
8
  • gracias , segui tu consejo, sin embargo, no me ha funcionado. Creo que quiza sea un bug de prime faces. el 27 jun. 2018 a las 18:21
  • Que versión de primefaces estas utilizando
    – SoftMolina
    el 27 jun. 2018 a las 18:34
  • 6.2, he intentado bajar a la 6,1 y 6.2, con el mismo resultado. el 27 jun. 2018 a las 19:08
  • He modificado el commandButton, pero sigue el mismo resultado. el 27 jun. 2018 a las 19:19
  • ¿Y si en lugar de actionListener usas action?El action listener se usa para otros casos. Pruebalo y me cuentas el 27 jun. 2018 a las 20:08

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.