将约束设置为sap.m.DatePicker
将约束设置为sap.m.DatePicker
提问于 2015-03-11 15:44:18
如何使我的DatePicker实现最小和最大日期约束？
如果选择了不允许的日期，我甚至不希望它触发更改事件，或者至少将日期恢复到允许的日期。我使用双向绑定，所以如果我更改日期，我的模型中的日期也会改变。
var oData = {
"minimumConstraint" : "2010-01-01",
"maximumConstraint" : "2020-01-01",
"displayDate" : "2015-01-01"
};
var oModel = new sap.ui.model.json.JSONModel(oData);
sap.ui.getCore().setModel(oModel);
var oDatePicker = new sap.m.DatePicker({
displayFormat: "dd-MM-yyyy",
valueFormat: "yyyy-MM-dd",
value: {path: "displayDate"}
});我也尝试了一些实现sap.ui.model.type.Date(oFormatOptions?，oConstraints?)的变体，但是它不起作用：
var oDatePicker = new sap.m.DatePicker({
displayFormat: "dd-MM-yyyy",
valueFormat: "yyyy-MM-dd",
value: {path: "displayDate",
type: new sap.ui.model.type.Date({
constraints: {
minimum: { path: "minimumConstraint"},
maximum: { path: "maximumConstraint"}
}
})
}
});回答 2
Stack Overflow用户
发布于 2015-08-25 14:13:09
我希望这能解决你的问题。我在数据报警器定义之外声明了一个日期类型。
在本例中，maximumDate =实际日期和minimumDate =实际日期减去15天：
var maximumDate = new Date();
var minimumDate = new Date();
minimumDate = minimumDate.setDate(minimumDate.getDate()-15);
var dateType = new sap.ui.model.type.Date({
pattern: "dd/MM/yyyy",
strictParsing: true
}, {
maximum: maximumDate,
minimum: minimumDate
});现在，只需使用日期类型声明数据报警器即可。
var oDatePicker = new sap.m.DatePicker(this.createId("datePickerTest"), {
type: "Date",
width: '200px',
value: {
path:"/dateValue",
type: dateType
},
placeholder: "Date"
});要查看此功能，可以添加验证函数。
oDatePicker.attachValidationError(function(oEvent) {
var oElement = oEvent.getParameter("element");
oElement.setValueState("Error");
});
oDatePicker.attachValidationSuccess(function(oEvent) {
var oElement = oEvent.getParameter("element");
oElement.setTooltip("");
oElement.setValueState("None");
});Stack Overflow用户
发布于 2015-08-25 20:36:08
下面是一个有用的示例(请参阅此吉斯宾)：
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Demo</title>
<script src="https://openui5beta.hana.ondemand.com/resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-libs="sap.m"
data-sap-ui-preload="sync">
</script>
<script>
var oData = {
minimumConstraint : "2015-08-01",
maximumConstraint : "2015-08-31",
displayDate : "2015-08-10"
};
var oModel = new sap.ui.model.json.JSONModel(oData);
sap.ui.getCore().setModel(oModel);
var oDatePicker = new sap.m.DatePicker({
width: '200px',
value: {
path:"/displayDate",
type: new sap.ui.model.type.Date({
pattern: "yyyy-MM-dd",
source: {
pattern: "yyyy-MM-dd"
},
strictParsing: true
}, {
maximum: oModel.getProperty("/maximumConstraint"),
minimum: oModel.getProperty("/minimumConstraint")
})
},
placeholder: "Date"
});
oDatePicker.attachValidationError(function(oEvent) {
var oElement = oEvent.getParameter("element");
var sMinDate = oModel.getProperty("/minimumConstraint");
var sMaxDate = oModel.getProperty("/maximumConstraint");
oElement.setValueState("Error");
oElement.setValueStateText("Enter date between " + sMinDate + " and " + sMaxDate);
});
oDatePicker.attachValidationSuccess(function(oEvent) {
var oElement = oEvent.getParameter("element");
oElement.setValueState("None");
oElement.setValueStateText(null);
});
oDatePicker.placeAt("content");
</script>
</head>
<body>
<div id="content"></div>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28991147
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号