JavaFX DatePicker getValue in a specific format

Question

I am currently using Scene Builder to make javafx scenes. I want to get value from the date picker in specific format. Simply using datePicker.getValue() returns date value in yyyy-mm-dd form. I want it in MMM dd, yyyy form. Can anybody help me with that?

The current complete datePickerController code is this

package date.picker;

import java.net.URL;
import java.time.LocalDate;
import java.time.format.DateTimeFormatter;
import java.util.ResourceBundle;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Alert;
import javafx.scene.control.Alert.AlertType;
import javafx.scene.control.Button;
import javafx.scene.control.DatePicker;
import javafx.scene.control.TextField;
import javafx.util.StringConverter;

/**
 * FXML Controller class
 *
 * @author Dushyant Patel
 */
public class DatePickerController implements Initializable {

@FXML
private TextField display;
@FXML
private DatePicker datePicker;
@FXML
private Button getDateBtn;
@FXML
private Button setDateBtn;

@FXML
private void getDateAction(ActionEvent event) {

    LocalDate date = datePicker.getValue();
    if (date != null) {
        display.setText(date.toString());
    } else {
        display.setText("");
    }
}

@FXML
private void datePickerAction(ActionEvent event) {
    LocalDate date = datePicker.getValue();
    if (date != null) {
        display.setText(date.toString());
    } else {
        display.setText("");
    }
}

@FXML
private void setDateAction(ActionEvent event) {
    if (!display.getText().trim().equals("")) {
        if (display.getText().length() != 10) {
            Alert alert = new Alert(AlertType.ERROR);
            alert.setTitle("Error Dialog");
            alert.setHeaderText("Date Error");
            alert.setContentText("Please type date in the correct date format!");

            alert.showAndWait();
        } else {
            LocalDate date = LocalDate.parse(display.getText());
            datePicker.setValue(date);
        }
    } else {
        datePicker.setValue(null);
    }

}

/**
 * Initializes the controller class.
 */
@Override
public void initialize(URL url, ResourceBundle rb) {
    String pattern = "MMM dd, yyyy";
    StringConverter converter = new StringConverter<LocalDate>() {
        DateTimeFormatter dateFormatter = DateTimeFormatter.ofPattern(pattern);

        @Override
        public String toString(LocalDate date) {
            if (date != null) {
                return dateFormatter.format(date);
            } else {
                return "";
            }
        }

        @Override
        public LocalDate fromString(String string) {
            if (string != null && !string.isEmpty()) {
                return LocalDate.parse(string, dateFormatter);
            } else {
                return null;
            }
        }
    };

    datePicker.setConverter(converter);
}

}

Answer 1

DataPicker refer converter in datapicker

 datePicker.setConverter(new StringConverter<LocalDate>() {
 String pattern = "yyyy-MM-dd";
 DateTimeFormatter dateFormatter = DateTimeFormatter.ofPattern(pattern);

 {
     datePicker.setPromptText(pattern.toLowerCase());
 }

 @Override public String toString(LocalDate date) {
     if (date != null) {
         return dateFormatter.format(date);
     } else {
         return "";
     }
 }

 @Override public LocalDate fromString(String string) {
     if (string != null && !string.isEmpty()) {
         return LocalDate.parse(string, dateFormatter);
     } else {
         return null;
     }
 }
});

Answer 2

Create a DateTimeFormatter with the pattern you specified (the syntax you gave for the pattern is exactly correct; the docs go into lots of detail on the pattern syntax).

DateTimeFormatter formatter = DateTimeFormatter.ofPattern("MMM dd, yyyy");

// ...

LocalDate date = datePicker.getValue();
if (date != null) {
    display.setText(formatter.format(date));
} else {
    display.setText("");
}

Answer 3

Using setConverter will not change the format of .getValue() method which you used to get the value of DatePicker setConverter will only change the displayed date on the DatePicker.

For Example to get DatePicker value :-

DateTimeFormatter formatter = DateTimeFormatter.ofPattern("MMM dd, yyyy",Locale.US);
String formattedValue = (myDatePicker.getValue()).format(formatter);

And to set the value of the DatePicker

String dateValue = "01 12, 2015";
myDatePicker.setValue(LocalDate.parse(dateValue,formatter));

Answer 4

The docs provide a great example for this. Just make sure your controller implements Initializable and then initialize it like this:

public class MyController implements Initializable {

  @FXML
  private DatePicker myDatePicker;

  @Override
  public void initialize(URL location, ResourceBundle resources) {

    myDatePicker.setConverter(
        new StringConverter<>() {
          final DateTimeFormatter dateFormatter = DateTimeFormatter.ofPattern("yyyy-MM-dd");

          @Override
          public String toString(LocalDate date) {
            return (date != null) ? dateFormatter.format(date) : "";
          }

          @Override
          public LocalDate fromString(String string) {
            return (string != null && !string.isEmpty())
                ? LocalDate.parse(string, dateFormatter)
                : null;
          }
        });

  }

}