JavaFX TableView - can not be edited

Question

I am trying to use the edit on a TableView. i used this tut as reference: http://docs.oracle.com/javafx/2/ui_controls/table-view.htm# but I am using a FXML file for the creation (with the JavaFX Scene Builder). I have checked the editable checkboxes for the table and the columns (in the Scene Builder), but if I execute the program, I am not able to edit the values. I have downloaded the example project from the tut and the editing works there... so, in my project the TextField doesn´t get opened :( The controller:

public class StatesPopupController implements Controllerable, Initializable {
    // <editor-fold desc="fxml import stuff" defaultstate="collapsed">
    @FXML //  fx:id="guiStatesTable"
    private TableView<StateData> guiStatesTable; // Value injected by FXMLLoader
    @FXML //  fx:id="guiColorColumn"
    private TableColumn<StateData, String> guiColorColumn; // Value injected by FXMLLoader
    @FXML //  fx:id="guiFontEffectColumn"
    private TableColumn<StateData, String> guiFontEffectColumn; // Value injected by FXMLLoader
    @FXML //  fx:id="guiUseColumn"
    private TableColumn<StateData, String> guiUseColumn; // Value injected by FXMLLoader
    @FXML //  fx:id="guiValueColumn"
    private TableColumn<StateData, String> guiValueColumn; // Value injected by FXMLLoader
    @FXML //  fx:id="guiStateAddColor"
    private TextField guiStateAddColor; // Value injected by FXMLLoader
    @FXML //  fx:id="guiStateAddFontEffect"
    private TextField guiStateAddFontEffect; // Value injected by FXMLLoader
    @FXML //  fx:id="guiStateAddUse"
    private TextField guiStateAddUse; // Value injected by FXMLLoader
    @FXML //  fx:id="guiStateAddValue"
    private TextField guiStateAddValue; // Value injected by FXMLLoader
// </editor-fold>

    private Modelable model = null;

    public StatesPopupController() {
        this.model = new StatesPopupModel();
    }

    @Override
    public Modelable getModel() {
        return model;
    }

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        this.guiStatesTable.setEditable(true);
        this.guiValueColumn.setCellValueFactory(new PropertyValueFactory<StateData, String>("value"));
        this.guiColorColumn.setCellValueFactory(new PropertyValueFactory<StateData, String>("color"));
        this.guiUseColumn.setCellValueFactory(new PropertyValueFactory<StateData, String>("use"));
        this.guiFontEffectColumn.setCellValueFactory(new PropertyValueFactory<StateData, String>("fontEffect"));
        this.guiStatesTable.setItems(((StatesPopupModel)this.model).getTableData());
    }

    public void newAddBtnEvent(ActionEvent event {
        ((StatesPopupModel)this.model).addDataEntry(guiStateAddValue.getText(), guiStateAddColor.getText(), guiStateAddUse.getText(), guiStateAddFontEffect.getText());
        guiStateAddValue.clear();
        guiStateAddColor.clear();
        guiStateAddUse.clear();
        guiStateAddFontEffect.clear();
        this.guiStatesTable.setItems(((StatesPopupModel) this.model).getTableData());
    }

    public void newEditValueEvent(CellEditEvent<StateData, String> event) {

        ((StateData)event.getTableView().getItems().get(event.getTablePosition().getRow())).setValue(event.getNewValue());
    }

    public void newEditColorEvent(ActionEvent event) {
        System.out.print("asd");
    }

    public void newEditUseEvent(ActionEvent event) {}

    public void newEditFontEffectEvent(ActionEvent event) {}
}

Model:

public class StatesPopupModel implements Modelable {
    private ObservableList<StateData> data = FXCollections.observableArrayList(
        new StateData("inactive", "9", "permit", "plain"),
        new StateData("active", "2", "permit", "plain"),
        new StateData("unavailable", "7", "inhibit", "plain"),
        new StateData("available", "2", "permit", "plain"),
        new StateData("invisible", "2", "inhibit", "plain"),
        new StateData("visible", "4", "permit", "plain"),
        new StateData("controlSign", "10", "inhibit", "plain"),
        new StateData("label", "5", "permit", "plain"));

    public void addDataEntry(String value, String color, String use, String fontEffect) {
        data.add(new StateData(value, color, use, fontEffect));
    }

    public ObservableList<StateData> getTableData() {
        return data;
    }
}

The StateData class:

public class StateData
{
    private final SimpleStringProperty value;
    private final SimpleStringProperty color;
    private final SimpleStringProperty use;
    private final SimpleStringProperty fontEffect;

    public StateData(String value, String color, String use, String fontEffect) {
        this.value = new SimpleStringProperty(value);
        this.color = new SimpleStringProperty(color);
        this.use = new SimpleStringProperty(use);
        this.fontEffect = new SimpleStringProperty(fontEffect);
    }

    /**
     * @return the value
     */
    public String getValue() {
        return value.get();
    }

    /**
     * @param value the value to set
     */
    public void setValue(String value) {
        this.value.set(value);
    }

    /**
     * @return the color
     */
    public String getColor() {
        return color.get();
    }

    /**
     * @param color the color to set
     */
    public void setColor(String color) {
        this.color.set(color);
    }

    /**
     * @return the use
     */
    public String getUse() {
        return use.get();
    }

    /**
     * @param use the use to set
     */
    public void setUse(String use) {
        this.use.set(use);
    }

    /**
     * @return the fontEffect
     */
    public String getFontEffect() {
        return fontEffect.get();
    }

    /**
     * @param fontEffect the fontEffect to set
     */
    public void setFontEffect(String fontEffect) {
        this.fontEffect.set(fontEffect);
    }
}

And here the fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>

<AnchorPane id="AnchorPane" minHeight="397.0" minWidth="264.0" prefHeight="397.0" prefWidth="427.0" xmlns:fx="http://javafx.com/fxml" fx:controller="controller.popup.StatesPopupController">
  <children>
    <Label text="States" AnchorPane.leftAnchor="14.0" AnchorPane.topAnchor="6.0">
      <font>
        <Font name="System Bold" size="15.0" />
      </font>
    </Label>
    <TableView fx:id="guiStatesTable" editable="true" prefHeight="311.0" prefWidth="236.0" AnchorPane.bottomAnchor="52.0" AnchorPane.leftAnchor="14.0" AnchorPane.rightAnchor="14.0" AnchorPane.topAnchor="34.0">
      <columns>
        <TableColumn prefWidth="75.0" text="Value" fx:id="guiValueColumn" />
        <TableColumn prefWidth="75.0" text="Color" fx:id="guiColorColumn" />
        <TableColumn prefWidth="75.0" text="Use" fx:id="guiUseColumn" />
        <TableColumn prefWidth="75.0" text="fontEffect" fx:id="guiFontEffectColumn" />
      </columns>
    </TableView>
    <HBox id="HBox" alignment="CENTER" prefWidth="236.0" spacing="5.0" AnchorPane.bottomAnchor="17.0" AnchorPane.leftAnchor="14.0" AnchorPane.rightAnchor="14.0">
      <children>
        <TextField fx:id="guiStateAddValue" prefWidth="93.0" promptText="Value" />
        <TextField fx:id="guiStateAddColor" prefWidth="79.0" promptText="Color" />
        <TextField fx:id="guiStateAddUse" prefWidth="79.0" promptText="Use" />
        <TextField fx:id="guiStateAddFontEffect" prefWidth="79.0" promptText="Font Effect" />
        <Button mnemonicParsing="false" onAction="#newAddBtnEvent" text="Add" />
      </children>
    </HBox>
  </children>
</AnchorPane>

Every help is welcome.

edit: If I am using:

.setCellFactory(TextFieldTableCell.forTableColumn());

I am getting this error:

error: method setCellFactory in class TableColumn<S,T> cannot be applied to given types;
    guiUseColumn.setCellFactory(TextFieldTableCell.forTableColumn());
                ^
  required: Callback<TableColumn<StateData,String>,TableCell<StateData,String>>
  found: Callback<TableColumn<Object,String>,TableCell<Object,String>>
  reason: actual argument Callback<TableColumn<Object,String>,TableCell<Object,String>> cannot be converted to Callback<TableColumn<StateData,String>,TableCell<StateData,String>> by method invocation conversion
  where S,T are type-variables:
    S extends Object declared in class TableColumn
    T extends Object declared in class TableColumn

Convery

i dont´t get it. this sucker just doesn´t open the textfield – Convery

Im having exactly the same issue. The problem seems to be that TextFieldTableCell.forTableColumn() uses generics as the method signature is as follows: public static <S extends Object> Callback<TableColumn<S, String>, TableCell<S, String>> forTableColumn() I haven't figured out yet how to call a static method that uses Generics. – Isogamy

Answer 1

To make TableView editable you should also provide a CellFactory which will handle creation of the editing controls.

You can find corresponding part of the tutorial here: http://docs.oracle.com/javafx/2/ui_controls/table-view.htm#sthref119

Discriminator

yeah i tried that, also. but i am getting this error: (see main post) do you know how to fix that? – Convery

i created a new callback with the given parameters and it works now! thanks. – Convery

@immerhart Posting the solution you came up with would help the SO community more than accepting an answer that did not provide you with the solution. – Flirtatious

Answer 2

try this:

....setCellFactory(TextFieldTableCell.<StateData>forTableColumn());

Julide

Answer 3

I had same issue and I didn't find an appropriate solution with separated FXML view and controller. I also want to stick with this model. Above mentioned example didn't work for me. So I slightly modified this tutorial.

The solution includes a custom TableCellFactory. It was necessary to change TableCell to TextFieldTableCell and add the following:

cell.setConverter(new StringConverter<T>() {
            @Override
            public String toString(T object) {
                return object.toString();
            }
            @Override
            public T fromString(String string) {
                return (T) string;
            }
        });

In Controller are new methods handling changes. For example

@FXML
protected void changeFirstName(CellEditEvent<Person, String> event) {
    ((Person) event.getTableView().getItems().get(event.getTablePosition().getRow())).setFirstName(event.getNewValue());
}

Reference is in FXML file

<TableColumn fx:id="firstNameColumn" text="First Name" prefWidth="100" onEditCommit="#changeFirstName">

You can find full changes in my full Maven example.

Danielladanielle