如何在OPENUI5中的sap.ui.unified.Calendar中处理下个月和上个月的事件?

时间:2015-03-02 07:33:02

标签: sapui5

嗨我正在尝试在sap.ui.unified.Calendar中实施openui5并逐月获取事件我需要下个月和上个月或当前可见月份等事件或方法。任何人都可以帮忙吗?

下面是我试图实施的链接

calender openui5

3 个答案:

答案 0 :(得分:0)

目前无法获得月度和年度更改的监听器。 我有相同的查询,并在openui5 github上引发了一个令牌。 你可以在以下链接上查看。

https://github.com/SAP/openui5/issues/361

干杯, harshal

答案 1 :(得分:0)

这就是我在onAfterRendering()方法中使用的方法

var oView = this.getView();
var oCalendar = oView.byId("usageCalendar");
var calendarHeaderRef = sap.ui.getCore().byId(oCalendar.sId + "--Head"); 


//to disable prev and next buttons    
calendarHeaderRef.setEnabledNext(false);
    calendarHeaderRef.setEnabledPrevious(false);

如果您想收听日历上的上一个和下一个按钮,可以使用

calendarHeaderRef.attachPressNext(this.calendarNextMonthPressed);
calendarHeaderRef.attachPressPrevious(this.calendarPrevMonthPressed);

感谢。

答案 2 :(得分:0)

收听月/年选择

sap.ui.unified.Calendar

您可以通过收听startDateChange来收听月份和年份导航。这是一个示例:

sap.ui.getCore().attachInit(() => sap.ui.require([
  "sap/ui/unified/Calendar",
], Calendar => new Calendar({
  startDateChange: event => {
    const navigatedDate = event.getSource().getStartDate();
    const monthYearText = navigatedDate.toLocaleString("default", {
      month: "long",
      year: "numeric",
    });
    alert(`Navigating to ${monthYearText}`);
  },
}).placeAt("content")))
<script id="sap-ui-bootstrap" src="https://ui5.sap.com/resources/sap-ui-core.js"
  data-sap-ui-libs="sap.ui.core, sap.m, sap.ui.unified"
  data-sap-ui-theme="sap_fiori_3"
  data-sap-ui-async="true"
  data-sap-ui-compatversion="edge"
  data-sap-ui-xx-waitForTheme="init"
></script>
<body id="content" class="sapUiBody sapUiSizeCompact"></body>

sap.m.DatePicker

对于DatePicker或从中派生的控件(DateTimePickerDateRangeSelection,...),同一事件与事件navigate一起应用

sap.ui.getCore().attachInit(() => sap.ui.require([
  "sap/m/DatePicker", // or DateTimePicker or DateRangeSelection, etc..
], DatePicker => new DatePicker({
  width: "17rem",
  placeholder: "Select month / year in Calendar -->",
  navigate: event => {
    if (!event.getParameter("afterPopupOpened")) {
      alert("Changing month / year");
    }
  }
}).placeAt("content")))
<script id="sap-ui-bootstrap" src="https://ui5.sap.com/resources/sap-ui-core.js"
  data-sap-ui-libs="sap.ui.core, sap.m, sap.ui.unified"
  data-sap-ui-theme="sap_fiori_3"
  data-sap-ui-async="true"
  data-sap-ui-compatversion="edge"
  data-sap-ui-xx-waitForTheme="init"
></script>
<body id="content" class="sapUiBody sapUiSizeCompact"></body>