Date entry

JWt supports several date entry methods, including a WCalendar, WTimeEdit and WDateEdit.

Date entry using a calendar

The WCalendar widget provides navigation by month and year, and indicates the current day.

Example
« 2025»
MonTueWedThuFriSatSun
24
25
26
27
28
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
3
4
source 
  void CalendarSimple() {
    WContainerWidget container = new WContainerWidget();
    final WCalendar c1 = new WCalendar((WContainerWidget) container);
    final WText out = new WText((WContainerWidget) container);
    out.addStyleClass("help-block");
    c1.selectionChanged()
        .addListener(
            this,
            () -> {
              Set<WDate> selection = c1.getSelection();
              if (selection.size() != 0) {
                WDate d = null;
                d = selection.iterator().next();
                WDate toDate = new WDate(d.getYear() + 1, 1, 1);
                int days = d.getDaysTo(toDate);
                out.setText(new WString("<p>That's {1} days until New Year's Day!</p>").arg(days));
              }
            });
  }

You can select multiple dates after passing the flag ExtendedSelection to the method setSelectionMode().

Example
« 2025»
MonTueWedThuFriSatSun
24
25
26
27
28
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
3
4
source 
  void CalendarExtended() {
    WContainerWidget container = new WContainerWidget();
    final WCalendar c2 = new WCalendar((WContainerWidget) container);
    c2.setSelectionMode(SelectionMode.Extended);
    final WText out = new WText((WContainerWidget) container);
    out.addStyleClass("help-block");
    c2.selectionChanged()
        .addListener(
            this,
            () -> {
              WString selected = new WString();
              Set<WDate> selection = c2.getSelection();
              for (WDate date : c2.getSelection()) {
                if (!(selected.length() == 0)) {
                  selected.append(", ");
                }
                selected.append(date.toString("dd/MM/yyyy"));
              }
              out.setText(
                  new WString("<p>You selected the following dates: {1}</p>").arg(selected));
            });
  }

Top

Date entry using a date edit

The WDateEdit widget is a line edit with support for date entry, using a WCalendar in a popup for editing the date. In the future, it is foreseen that this widget can evolve to use browser support for easy date entry.

By default the selected date is shown in the format defined by your WLocale settings as in the first example. In the second example the format is set to "dd MM yyyy".

Example

When do you want to take your holiday?

source 
  void DateEdit() {
    WTemplate form = new WTemplate(WString.tr("dateEdit-template"));
    form.addFunction("id", WTemplate.Functions.id);
    final WDateEdit de1 = new WDateEdit();
    form.bindWidget("from", de1);
    de1.setDate(WDate.getCurrentServerDate().addDays(1));
    final WDateEdit de2 = new WDateEdit();
    form.bindWidget("to", de2);
    de2.setFormat("dd MM yyyy");
    de2.getCalendar().setHorizontalHeaderFormat(CalendarHeaderFormat.SingleLetterDayNames);
    de2.setBottom(de1.getDate());
    WPushButton button = new WPushButton("Save");
    form.bindWidget("save", button);
    final WText out = new WText();
    form.bindWidget("out", out);
    de1.changed()
        .addListener(
            this,
            () -> {
              if (de1.validate() == ValidationState.Valid) {
                de2.setBottom(de1.getDate());
                out.setText("Date picker 1 is changed.");
              }
            });
    de2.changed()
        .addListener(
            this,
            () -> {
              if (de1.validate() == ValidationState.Valid) {
                de1.setTop(de2.getDate());
                out.setText("Date picker 2 is changed.");
              }
            });
    button
        .clicked()
        .addListener(
            this,
            () -> {
              if (de1.getText().length() == 0 || de2.getText().length() == 0) {
                out.setText("You should enter two dates!");
              } else {
                int days = de1.getDate().getDaysTo(de2.getDate()) + 1;
                if (days == 1) {
                  out.setText("It's fine to take holiday just for one day!");
                } else {
                  if (days > 1) {
                    out.setText(
                        new WString("So, you want to take holiday for a period of {1} days?")
                            .arg(days));
                  } else {
                    out.setText("Invalid period!");
                  }
                }
              }
            });
  }

Top

Time entry using a time edit

The WTimeEdit widget is a line edit with support for time entry.

Example

When do you want your package to be delivered?

source 
  void TimeEdit() {
    WTemplate form = new WTemplate(WString.tr("timeEdit-template"));
    form.addFunction("id", WTemplate.Functions.id);
    final WTimeEdit te1 = new WTimeEdit();
    form.bindWidget("from", te1);
    form.bindString("from-format", te1.getFormat());
    te1.setTime(WTime.getCurrentTime());
    final WTimeEdit te2 = new WTimeEdit();
    form.bindWidget("to", te2);
    te2.setFormat("h:mm:ss.SSS a");
    te2.setTime(WTime.getCurrentTime().addSecs(60 * 15));
    form.bindString("to-format", te2.getFormat());
    WPushButton button = new WPushButton("Save");
    form.bindWidget("save", button);
    final WText out = new WText();
    form.bindWidget("out", out);
    te1.changed()
        .addListener(
            this,
            () -> {
              if (te1.validate() == ValidationState.Valid) {
                out.setText("Time picker 1 is changed.");
              }
            });
    te2.changed()
        .addListener(
            this,
            () -> {
              if (te2.validate() == ValidationState.Valid) {
                out.setText("Time picker 2 is changed.");
              }
            });
    button
        .clicked()
        .addListener(
            this,
            () -> {
              if (te1.getText().length() == 0 || te2.getText().length() == 0) {
                out.setText("You should enter two times!");
              } else {
                long secs = te1.getTime().secsTo(te2.getTime()) + 1;
                if (secs <= 60 * 10) {
                  out.setText("This is a really small range of time");
                } else {
                  out.setText(
                      new WString("So, you want your package to be delivered between {1} and {2}?")
                          .arg(te1.getTime().toString())
                          .arg(te2.getTime().toString()));
                }
              }
            });
  }

Top