使用 sap.m.DatePicker 只选择年份 [英] Use sap.m.DatePicker to select only year
本文介绍了使用 sap.m.DatePicker 只选择年份的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有个约会.它是 JSONModel 中的字符串(例如 '2016')，由 DateTimeInput 显示:
<DateTimeInput值="{年}"displayFormat="yyyy"值格式=yy"/>但是，DateTimeInput 已弃用，我想用
I have a date. It is a string in the JSONModel (for example '2016'), shown by DateTimeInput:
<DateTimeInput
value="{year}"
displayFormat="yyyy"
valueFormat="yy"
/>
However, DateTimeInput is deprecated and I want replace it by DatePicker:
<DatePicker
value="{year}"
displayFormat="yyyy"
valueFormat="yy"
/>
But when the click on the value help, the picker shows the calendar, not the list of years only.
解决方案
As of UI5 1.68, DatePicker is capable of displaying the year-picker only. To enable it, displayFormat and valueFormat should be "yyyy".
Below is a small demo, including binding and validation:
sap.ui.getCore().attachInit(() => sap.ui.require([
"sap/ui/core/Fragment",
"sap/ui/model/json/JSONModel",
"sap/ui/core/Core",
], async (Fragment, JSONModel, Core) => {
"use strict";
const control = await Fragment.load({
definition: `<DatePicker xmlns="sap.m" xmlns:core="sap.ui.core"
core:require="{ DateType: 'sap/ui/model/type/Date' }"
maxDate="{/maxDate}"
class="sapUiTinyMargin"
displayFormat="yyyy"
valueFormat="yyyy"
width="7rem"
value="{
path: '/myYear',
type: 'DateType',
formatOptions: {
pattern: 'yyyy',
source: {
pattern: 'yyyy'
}
},
constraints: { maximum: 2030 }
}"
/>`,
});
Core.getMessageManager().registerObject(control, true);
control.setModel(new JSONModel({
myYear: new Date().getFullYear(), // current year, e.g. 2019
maxDate: new Date("2030-12-31") // control awaits a JS date object for maxDate
})).placeAt("content");
}));
<script id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.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"></body>
这篇关于使用 sap.m.DatePicker 只选择年份的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
