Sapui5 / Openui5 / Javascript两个Popups在一个Inputfield上:立即关闭一个

时间:2015-03-06 13:40:17

标签: javascript jquery html sapui5

我在单日期输入字段上有两个弹出窗口。一个位于日期字段的右侧,表示用户的验证输入错误。另一个在字段下方或上方显示日历选择器。问题是如果“autoclose”为“true”,日历选择器会在打开后立即关闭。弹出窗口的类型为sap.ui.ux3.ToolPopup。我也试过sap.m.Popup。行为是一样的,仍然是同样的问题。我怎么解决这个问题?这是我为日历选择器所做的。

//called on init
this._calendarPopup = new sap.ui.ux3.ToolPopup({
        content : [ this._calendar ], //complete calendar control which should be displayed on the popup
        opener : _self,
        autoClose : false,
        openDuration : 1,
        closeDuration : 1,
        closed : function() {
            _self.unselectDates();
        },
    })

this.attachBrowserEvent("click", function() {//if the field is a date Field attach the calendar picker
        if (_self.get_dataType() == "date") {
            _self.onOpenCalendar();
        }
    });
//end called on init

onOpenCalendar : function() {
    var _self = this;
    if (this.get_changeable()) {
        _self._calendarPopup.setOpener(_self.getId());
        _self._calendarPopup.open(sap.ui.core.Popup.Dock.LeftTop, sap.ui.core.Popup.Dock.LeftBottom);
    }
},

目前日历仅在日期选择时关闭。这不是用户友好的行为。当用户在日历外部点击时(不设置日期),日历也应该关闭。

错误弹出窗口的类似attachBrowserEvent函数。

//called on init in other class tha
this.cancelCommentPopup = new sap.ui.ux3.ToolPopup({
        content : [ this.cancelCommentText ],
        autoClose : true,
        openDuration : 1,
        closeDuration : 1,
    }).addStyleClass("CancelCommentPopup");


onOpenCancelCommentPopup : function(openerControl, entity, i, field) {
    this.cancelCommentPopup.setOpener(openerControl.getId());
    this.cancelCommentText.setText(JSON.parse(entity.response.body).error.message.value);
    this.cancelCommentPopup.open(sap.ui.core.Popup.Dock.BeginCenter);
},

1 个答案:

答案 0 :(得分:0)

Thx @zyrex,就是这样。

field._calendarPopup.attachOpen(function(e) {
        _self.cancelCommentPopup.setOpener(field.getId());
        _self.cancelCommentText.setText(JSON.parse(entity.response.body).error.message.value);
        _self.cancelCommentPopup.open(sap.ui.core.Popup.Dock.BeginCenter);
});

使用attachOpen()打开日历的open方法,打开cancelCommentPopup。关闭也是如此。

field._calendarPopup.attachClosed(function(e) {
        _self.cancelCommentPopup.close();
});

完美的作品。问题解决了。