sap.m.Date(Time)Picker 的掩码输入 [英] Mask input for sap.m.Date(Time)Picker

问题描述

使用 sap.m.DateTimePicker，用户可以从下拉列表中选择一个值或手动输入它.我想知道是否有办法向手动输入框添加与 DateTimePicker 的 valueFormat 匹配的掩码.

我知道还有一个 sap.m.MaskInput，所以也许有一种方法可以组合这两个元素.

解决方案

有一个名为

示例: https://stackoverflow.com/a/48482544

With the sap.m.DateTimePicker, it's possible for a user to either select a value from the drop-down list or enter it manually. I'm wondering if there's a way to add a mask to the manual input box that matches the valueFormat of the DateTimePicker.

I know there's a sap.m.MaskInput as well, so maybe there's a way to combine the two elements.

解决方案

There is a new private module named sap.m.MaskEnabler which the sap.m.InputBase (i.e. DateTimePicker) is supposed to make use of.

(MaskEnabler) should be applied to the prototype of a sap.m.InputBase.

The mask feature is currently enabled only in sap.m.TimePicker (v1.54). According to this commit message, however, the same feature will arrive to the Date(Time)Picker as well:

This change prepares for refactoring of DatePicker and TimePicker so the common code of both pickers can be moved to a new common control that they may extend.

Therefore, if it's not urgent, and depending on your project, I'd not create a new custom control and then throw it away once the mask feature has arrived.

I'll update my answer when it's available.

---

Until then (and even afterwards), you can still guide the user to enter the data in the correct format via OData binding type sap.ui.model.odata.type.DateTime:

<DateTimePicker
  value="{
    path: 'myODataModel>myDateTime',
    type: 'sap.ui.model.odata.type.DateTime',
    constraints: {
      isDateOnly: true,
      displayFormat: 'Date'
    }
  }"
  minDate="{...}"
  maxDate="{...}"
/>

• In contrast to formatter, type allows us to keep two-way data binding.
• The entered value is automatically intercepted from updating the model data when...
  1. It could not be parsed due to an invalid format (fires parseError)
  2. It could be parsed but the constraints were violated (fires validationError)

• If you enable handling UI messages additionally, the framework will then take care of creating the appropriate message for the user:

Example: https://stackoverflow.com/a/48482544

这篇关于sap.m.Date(Time)Picker 的掩码输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！