How do I show each character in TextArea when it is typed in TextField?

Question

I am trying to show every character instantly into TextArea as and when it is typed into the TextField .

I've written some code as follows but it didn't work:

Application_Controler.java

public class Application_Controler {

    @FXML
    private TextField txt;

    @FXML
    private TextArea showTxt;

    @FXML
    void keyTyped(ActionEvent event) {
        String text = txt.getText();
        String oldText = showTxt.getText();
        String nextText = oldText+text;
        showTxt.setText(nextText);
    }

}

Here is the .fxml file:

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

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


<AnchorPane xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.40" fx:controller="imran.jfx.application.Application_Controler">
   <children>
      <AnchorPane layoutX="-17.0" layoutY="-14.0" prefHeight="461.0" prefWidth="454.0">
         <children>
            <TextField fx:id="txt" layoutX="122.0" layoutY="87.0" onKeyTyped="#keyTyped" prefHeight="55.0" prefWidth="229.0" />
            <TextArea fx:id="showTxt" layoutX="56.0" layoutY="215.0" prefHeight="210.0" prefWidth="362.0" />
         </children>
      </AnchorPane>
   </children>
</AnchorPane>

How should I do it?

Answer 1

You can bind the textProperty() of TextField to the textProperty() of TextArea .

textArea.textProperty().bind(textField.textProperty());

Try adding the following code inside the initialize() of your controller :

public class Application_Controler implements Initializable {

    @FXML
    private TextField txt;

    @FXML
    private TextArea showTxt;

    @Override
    public void initialize(URL location, ResourceBundle resources) {
         showTxt.textProperty().bind(txt.textProperty());
    }
}