DataTable component of primefaces is not updated correctly

2

I try to refresh the dataTabale component of primefaces when I delete a record from the table, however, when I click on the delete button, sometimes the table is updated and sometimes not, then I have to manually refresh the entire page to see the change in the dataTable component.

I noticed something curious, every time I upload the application to the server again (wildfly 8.2) and start with the 4 record (Hulk), the dataTable component is updated immediately, if I start with the first or last record, I have to press the Delete button several times, until the component is refreshed.

Record to be deleted.

Registration removed

  <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) - Web Layer / Presentation

 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 (services) - Business Layer

@Stateless
public class StudentServiceImpl implements StudentService {

@Inject
private StudentDao studentDao;

...

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

EJB (Dao) - Data Access Layer

@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);
            }
        }
    }
}

Static database

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);
}
}

Student Model (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 -->
}

I have tried in many ways, to solve it, however, I have not been able until now, I have read, other problems similar to mine, however, they have not worked for me.

link

Problem when updating datatable component of primefaces

I had even asked the question in stackoverflow in English and they have given me some advice, but they have not worked for me.

link

Any ideas?

Thanks in advance.

    
asked by webtechnelson 27.06.2018 в 14:24
source

2 answers

2

Finally after searching for several days, possible solutions, I came to the conclusion that it could be a PrimeFaces problem, however, I found that the collector component is ideal to perform the 4 CRUD operations (insert, read, update and eliminate) quickly and with less code.

The following link shows an example of the official primefaces page using this component.

Example of a Datatable component of Primefaces in action

In this way with a MVC model, it is very easy to implement the logic to insert, read, update and delete elements of the table.

I hope this information is helpful to someone. I enclose the Github repository of how to implement the component. As you can see, the cosigo is much smaller, since it decides to make a refactor of everything and change from a Multilayer architecture to a simple MVC design.

MVC application with JSF and PrimeFaces

    
answered by 04.07.2018 / 16:35
source
0

Hi I had that problem and it was because of the init () instead of checking the list again in PostConstruct create another example method:

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

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

or try sending the query in the same method to discard this option.

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

Modify the update of the commandButton in the following way by updating the component directly:

<p:commandButton value="Delete" actionListener="#{studentsController.deleteStudent}"  icon="ui-icon-close" update=":#{p:component('studentsDataTable')}"/>
    
answered by 27.06.2018 в 19:30