将限制设置为sap.m.DatePicker

问题描述

如何获取我的DatePicker来实现我的最小和最大日期约束？

How do I get my DatePicker to implement my minimum and maximum date constraint?

如果选择了一个不允许的日期，我最好不想触发更改事件，或至少将日期还原为允许的日期。我使用双向绑定，所以如果我更改日期，我的模型中的日期也会更改。

If an unallowed date is chosen, I preferably do not even want it to trigger a change event, or at least revert the date to one that is allowed. I use 2-way binding, so if I change the date, the date in my model also changes.

   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？），但不起作用：

I also tried some variations of implementing sap.ui.model.type.Date(oFormatOptions?, oConstraints?), but it does not work:

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"}
                            }
                 })
          }
});

推荐答案

我希望这可以解决您的问题。我在datepicker的定义之外声明一个日期类型。

I hope this can resolve your problem. I declare a date type outside the definition of the datepicker.

在此示例中，maximumDate =实际日期和minimumDate =实际日期少于15天：

In this example maximumDate = actual date and minimumDate = actual date less 15 days:

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
    });

现在只需声明具有日期类型的datepicker。

Now just declare the datepicker with the date type.

var oDatePicker = new sap.m.DatePicker(this.createId("datePickerTest"), {
        type: "Date",
        width: '200px',
        value: {
            path:"/dateValue",
            type: dateType
        },
        placeholder: "Date"
    });

要查看此工作，您可以添加验证功能。

To see this working you can add validation functions.

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");
 });

这篇关于将限制设置为sap.m.DatePicker的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！