选择相同日期GWT后,Datepicker不会关闭

时间:2017-11-10 20:28:33

标签: java jquery gwt datepicker

我从java脚本调用java来使用以下方法关闭日期选择器弹出窗口。

    private native void attachInternal() /*-{+      
    $wnd.jQuery("div.datePickerDay.datePickerDayIsValue").on( "Click", function() {
       this.@com.booxi.admin.client.common.ui.text.DateFormatter::uiDatePickerPopup.hide();

      console.log("OK");
    });
}-*/;

在附加的方法中再次调用此方法。

问题是日期选择器在选择已经选择的相同日期后没有关闭,但是在值改变时它会关闭。我想在选择与之前相同的日期后关闭它。 关注方法如下

    public void attach() {
    attachInternal();

    datePickerValueChangeRegistration = uiDatePicker.addValueChangeHandler(new ValueChangeHandler<Date>() {
        @Override
        public void onValueChange(ValueChangeEvent<Date> event) {
            uiDatePickerPopup.hide();
            uiTextDate.setErrorVisible(false);
            uiTextDate.setTextNoFormat(Moment.moment(event.getValue()).format("L"));
        }
    });

    textDateClickRegistration = uiTextDate.addClickHandler(new ClickHandler() {
        @Override
        public void onClick(ClickEvent event) {
            //if (uiTextDate.isReadOnly())
            //  return;
            if (!uiTextDate.isEnabled())
                return;
            showPopup();

        }
    });

2 个答案:

答案 0 :(得分:0)

您的JSNI错误:您正在获取hide()方法的方法引用,但实际上并未调用它。此外,回调中的this可能是HTML元素,而不是此方法所属的类(最后,click可能必须全部小写 - 我不知道jQuery,所以我可能错了。)

因此应该如下:

private native void attachInternal() /*-{
  var that = this;
  $wnd.jQuery("div.datePickerDay.datePickerDayIsValue").on( "click", function() {
    that.@com.booxi.admin.client.common.ui.text.DateFormatter::uiDatePickerPopup.hide()();
    console.log("OK");
  });
}-*/;

答案 1 :(得分:0)

有点晚了,但是如果有人遇到同样的问题也许会有所帮助。

我犯了同样的错误。问题是,仅当选择了其他值时,才会触发change事件。如果用户再次选择相同的值,则没有值更改,事件不会触发,不会执行您的代码,并且不会隐藏弹出窗口。

您必须使用单击事件而不是值更改事件。然后,即使单击旧值,也可以每次单击执行代码。但是,如果仅将change事件替换为click事件,则当用户单击日期选择器的标题时(例如,当他单击箭头以选择其他月份时),也会执行该代码。这样会破坏日期选择器的功能。

因此,在click事件中,您必须检查单击是否确实在日期单元格中,而不是在标题中。可以使用Element.as(event.getNativeEvent().getEventTarget())完成,并检查元素的内容,最简单的方法是检查内部文本是否为1到31之间的日期数字。

所以代码是这样的

uiDatePickerPopup.addDomHandler(new ClickHandler() {

  @Override
  public void onClick(ClickEvent event) {
    Element target = Element.as(event.getNativeEvent().getEventTarget());
    String targetContent = target.getInnerText();
    try {
      int d = Integer.parseInt(targetContent);
      if (d >= 1 && d <= 31) {
        uiDatePickerPopup.hide();

        ...
        enter the rest of your code here
        ...

      }
    } catch (Exception e) {
      /* ignore, click was not on a date cell */
    }
  }

}, ClickEvent.getType());

(据我所知,没有其他更好的解决方案。其他可能的事件没有用,并且您不能将click事件仅限于日期单元格,因为getView()方法是{{ 1}},基础protectedCalendarView,因此不能扩展到提供必要内容检查的子类。)