JavaFx 2.1, 2.2 TableView update issue

Question

My application uses JPA read data into TableView then modify and display them. The table refreshed modified record under JavaFx 2.0.3. Under JavaFx 2.1, 2.2, the table wouldn't refresh the update anymore. I found other people have similar issue. My plan was to continue using 2.0.3 until someone fixes the issue under 2.1 and 2.2. Now I know it is not a bug and wouldn't be fixed. Well, I don't know how to deal with this. Following are codes are modified from sample demo to show the issue. If I add a new record or delete a old record from table, table refreshes fine. If I modify a record, the table wouldn't refreshes the change until a add, delete or sort action is taken. If I remove the modified record and add it again, table refreshes. But the modified record is put at button of table. Well, if I remove the modified record, add the same record then move the record to the original spot, the table wouldn't refresh anymore. Below is a completely code, please shine some light on this.

    import javafx.application.Application;
    import javafx.beans.property.SimpleStringProperty;
    import javafx.collections.FXCollections;
    import javafx.collections.ObservableList;
    import javafx.event.ActionEvent;
    import javafx.event.EventHandler;
    import javafx.geometry.HPos;
    import javafx.geometry.Insets;
    import javafx.geometry.Pos;
    import javafx.scene.Group;
    import javafx.scene.Scene;
    import javafx.scene.control.*;
    import javafx.scene.control.cell.PropertyValueFactory;
    import javafx.scene.layout.GridPane;
    import javafx.scene.layout.HBox;
    import javafx.scene.layout.VBox;
    import javafx.scene.text.Font;
    import javafx.stage.Modality;
    import javafx.stage.Stage;
    import javafx.stage.StageStyle;

    public class Main extends Application {

        private TextField firtNameField = new TextField();
        private TextField lastNameField = new TextField();
        private TextField emailField = new TextField();
        private Stage editView;
        private Person fPerson;

        public static class Person {

            private final SimpleStringProperty firstName;
            private final SimpleStringProperty lastName;
            private final SimpleStringProperty email;

            private Person(String fName, String lName, String email) {
                this.firstName = new SimpleStringProperty(fName);
                this.lastName = new SimpleStringProperty(lName);
                this.email = new SimpleStringProperty(email);
            }

            public String getFirstName() {
                return firstName.get();
            }

            public void setFirstName(String fName) {
                firstName.set(fName);
            }

            public String getLastName() {
                return lastName.get();
            }

            public void setLastName(String fName) {
                lastName.set(fName);
            }

            public String getEmail() {
                return email.get();
            }

            public void setEmail(String fName) {
                email.set(fName);
            }
        }
        private TableView<Person> table = new TableView<Person>();
        private final ObservableList<Person> data =
                FXCollections.observableArrayList(
                new Person("Jacob", "Smith", "[e-mail]"),
                new Person("Isabella", "Johnson", "[e-mail]"),
                new Person("Ethan", "Williams", "[e-mail]"),
                new Person("Emma", "Jones", "[e-mail]"),
                new Person("Michael", "Brown", "[e-mail]"));

        public static void main(String[] args) {
            launch(args);
        }

        @Override
        public void start(Stage stage) {
            Scene scene = new Scene(new Group());
            stage.setTitle("Table View Sample");
            stage.setWidth(535);
            stage.setHeight(535);
            editView = new Stage();

            final Label label = new Label("Address Book");
            label.setFont(new Font("Arial", 20));

            TableColumn firstNameCol = new TableColumn("First Name");
            firstNameCol.setCellValueFactory(
                    new PropertyValueFactory<Person, String>("firstName"));
            firstNameCol.setMinWidth(150);

            TableColumn lastNameCol = new TableColumn("Last Name");
            lastNameCol.setCellValueFactory(
                    new PropertyValueFactory<Person, String>("lastName"));
            lastNameCol.setMinWidth(150);
            TableColumn emailCol = new TableColumn("Email");
            emailCol.setMinWidth(200);
            emailCol.setCellValueFactory(
                    new PropertyValueFactory<Person, String>("email"));

            table.setItems(data);
            table.getColumns().addAll(firstNameCol, lastNameCol, emailCol);
    //--- create a edit button and a editPane to edit person   
            Button addButton = new Button("Add");
            addButton.setOnAction(new EventHandler<ActionEvent>() {

                @Override
                public void handle(ActionEvent event) {
                    fPerson = null;
                    firtNameField.setText("");
                    lastNameField.setText("");
                    emailField.setText("");
                    editView.show();
                }
            });
            Button editButton = new Button("Edit");
            editButton.setOnAction(new EventHandler<ActionEvent>() {

                @Override
                public void handle(ActionEvent event) {
                    if (table.getSelectionModel().getSelectedItem() != null) {
                        fPerson = table.getSelectionModel().getSelectedItem();
                        firtNameField.setText(fPerson.getFirstName());
                        lastNameField.setText(fPerson.getLastName());
                        emailField.setText(fPerson.getEmail());
                        editView.show();
                    }
                }
            });
            Button deleteButton = new Button("Delete");
            deleteButton.setOnAction(new EventHandler<ActionEvent>() {

                @Override
                public void handle(ActionEvent event) {
                    if (table.getSelectionModel().getSelectedItem() != null) {
                        data.remove(table.getSelectionModel().getSelectedItem());
                    }
                }
            });
            HBox addEditDeleteButtonBox = new HBox();
            addEditDeleteButtonBox.getChildren().addAll(addButton, editButton, deleteButton);
            addEditDeleteButtonBox.setAlignment(Pos.CENTER_RIGHT);
            addEditDeleteButtonBox.setSpacing(3);

            GridPane editPane = new GridPane();
            editPane.getStyleClass().add("editView");
            editPane.setPadding(new Insets(3));
            editPane.setHgap(5);
            editPane.setVgap(5);
            Label personLbl = new Label("Person:");
            editPane.add(personLbl, 0, 1);
            GridPane.setHalignment(personLbl, HPos.LEFT);

            firtNameField.setPrefWidth(250);
            lastNameField.setPrefWidth(250);
            emailField.setPrefWidth(250);
            Label firstNameLabel = new Label("First Name:");
            Label lastNameLabel = new Label("Last Name:");
            Label emailLabel = new Label("Email:");

            editPane.add(firstNameLabel, 0, 3);
            editPane.add(firtNameField, 1, 3);
            editPane.add(lastNameLabel, 0, 4);
            editPane.add(lastNameField, 1, 4);
            editPane.add(emailLabel, 0, 5);
            editPane.add(emailField, 1, 5);
            GridPane.setHalignment(firstNameLabel, HPos.RIGHT);
            GridPane.setHalignment(lastNameLabel, HPos.RIGHT);
            GridPane.setHalignment(emailLabel, HPos.RIGHT);

            Button saveButton = new Button("Save");
            saveButton.setOnAction(new EventHandler<ActionEvent>() {

                @Override
                public void handle(ActionEvent event) {
                    if (fPerson == null) {
                        fPerson = new Person(
                                firtNameField.getText(),
                                lastNameField.getText(),
                                emailField.getText());
                        data.add(fPerson);
                    } else {
                        int k = -1;
                        if (data.size() > 0) {
                            for (int i = 0; i < data.size(); i++) {
                                if (data.get(i) == fPerson) {
                                    k = i;
                                }
                            }
                        }
                        fPerson.setFirstName(firtNameField.getText());
                        fPerson.setLastName(lastNameField.getText());
                        fPerson.setEmail(emailField.getText());
                        data.set(k, fPerson);
                        table.setItems(data);

    //  The following will work, but edited person has to be added to the button
    //
    //                    data.remove(fPerson);
    //                    data.add(fPerson);

    // add and remove refresh the table, but now move edited person to original spot, 
    // it failed again with the following code
    //                    while (data.indexOf(fPerson) != k) {
    //                        int i = data.indexOf(fPerson);
    //                        Collections.swap(data, i, i - 1);
    //                    }
                    }
                    editView.close();
                }
            });
            Button cancelButton = new Button("Cancel");
            cancelButton.setOnAction(new EventHandler<ActionEvent>() {

                @Override
                public void handle(ActionEvent event) {
                    editView.close();
                }
            });

            HBox saveCancelButtonBox = new HBox();
            saveCancelButtonBox.getChildren().addAll(saveButton, cancelButton);
            saveCancelButtonBox.setAlignment(Pos.CENTER_RIGHT);
            saveCancelButtonBox.setSpacing(3);

            VBox editBox = new VBox();
            editBox.getChildren().addAll(editPane, saveCancelButtonBox);

            Scene editScene = new Scene(editBox);
            editView.setTitle("Person");
            editView.initStyle(StageStyle.UTILITY);
            editView.initModality(Modality.APPLICATION_MODAL);
            editView.setScene(editScene);
            editView.close();

            final VBox vbox = new VBox();
            vbox.setSpacing(5);
            vbox.getChildren().addAll(label, table, addEditDeleteButtonBox);
            vbox.setPadding(new Insets(10, 0, 0, 10));

            ((Group) scene.getRoot()).getChildren().addAll(vbox);

            stage.setScene(scene);
            stage.show();
        }
    }

Answer 1

I have the same problem, and not being able to add SimpleStringProperty to the POJO's used by JPA makes this a bit problematic. But it seems to me that this should be fixable issue because I have noticed the following behavior:

1. In my application, clicking on a row in the table populates some text fields on the screen, that the user can then edit.

2. At that point the user can save the data, or create a new item with the same or changed data. If the user creates a new item, which is then inserted into the observable list that the tableview represents, the change is immediately reflected in the contents of the tableview. However if the user just saves the change the new data is not reflected in the table. To put the new data in the list I'm simply doing

   trialList.set(currentIndex, tempTrial);
   

3. And here's what I think points to this as a fixable issue: if I scroll the affected row out of view on the table and then scroll it back, the 'new' value(s) are now presented.

Hopefully, this can be fixed. Sorry this isn't an answer, so to speak, but might provide some insight for a fix.

Answer 2

I had the same problem and after some search this is my workaround. I found that if the columns are removed and then re-added the table is updated.

public static <T,U> void refreshTableView(final TableView<T> tableView, final List<TableColumn<T,U>> columns, final List<T> rows) {
    if (tableView == null) {
        throw new NullPointerException();
    }
    if (columns == null) {
        throw new NullPointerException();
    }
    if (rows == null) {
        throw new NullPointerException();
    }

    tableView.getColumns().clear();
    tableView.getColumns().addAll(columns);

    ObservableList<T> list = FXCollections.observableArrayList(rows);
    tableView.setItems(list);
}

Example of usage:

refreshTableView(myTableView, Arrays.asList(col1, col2, col3), rows);

Answer 3

looking into the TableView.java code, there's private refresh() which just executes

getProperties().put(TableViewSkinBase.REFRESH, Boolean.TRUE); 

At last, the code below worked for me(Java8). (be careful, the constant's name is not REFRESH but RECREATE)

tableView.getProperties().put(TableViewSkinBase.RECREATE, Boolean.TRUE);

(reading javafx's code, this will force cell re-creation)

Answer 4

Notification-based updates of JavaFX controls typically require that the properties of the data model object backing your GUI meet the minimum definition for a JavaFX Bean.

The following exemplifies the minimum code needed in order for a JavaFX property to satisfy these requirements:

public class Client extends DB {

    private IntegerProperty id =         new SimpleIntegerProperty();
    private StringProperty  lastName =   new SimpleStringProperty();
    private StringProperty  firstName =  new SimpleStringProperty();


    public final int getID() {return this.id.get(); }
    void setID(int id) { this.id.set(id); }
    public final IntegerProperty idProperty() { return this.id; }

    public final String getLastName() { return this.lastName.get(); }
    public final void setLastName(String ln) { this.lastName.set(ln); }
    public final StringProperty lastNameProperty() { return this.lastName; }

    public final String getFirstName() { return this.firstName.get(); }
    public final void setFirstName(String fn) { this.firstName.set(fn); }
    public final StringProperty firstNameProperty() { return this.firstName; }
    :
    :
}    

Glancing over your code, it does not appear that your properties satisfy the requirements for a JavFX Bean. As such, automatic notification-based updates will not occur.

Answer 5

See the answer to Updating rows in Tableview. Add these getters and it will just work.
Additionally since the data is an ObservableList which is set as items to tableView, any changes to this data list will be reflected to the table.getItems() too. Namely no need to table.setItems(data) again.

Answer 6

I have found a simple workaround for triggering the refresh of the TableView in JavaFX 2.1 TableView refresh items. It solved the issue for me.

Add this to your code:

tableView.getColumns().get(0).setVisible(false);
tableView.getColumns().get(0).setVisible(true);