首页 > 解决方案 > 验证特定格式

问题描述

我正在考虑验证我的程序的输入应该具有这种格式:XXXXXXXX-Y

所以这就是原因。输入类型 "Number"不适用于这种情况。

https://es.wikipedia.org/wiki/Rol_%C3%9Anico_Tributario

标签: javascriptregexsapui5

解决方案


这是[API]的典型用例。使用 MaskInput 消除了验证(在前端)的需要,因为它甚至不允许输入无效字符,这也改善了用户体验。sap.m.MaskInput

当然,您也可以继续使用sap.m.Input. 在这种情况下,您可以使用具有等待正则表达式sap.ui.model.(odata.)type.String的约束的类型。search错误的输入不会传递给绑定模型。

这是一个展示这两个示例的演示:

sap.ui.getCore().attachInit(() => sap.ui.require([
  "sap/ui/core/mvc/XMLView",
  "sap/ui/model/json/JSONModel"
], (XMLView, JSONModel) => XMLView.create({
  definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc"
    xmlns:form="sap.ui.layout.form"
    xmlns="sap.m"
    height="100%"
    displayBlock="true"
  >
    <App>
      <Page
        class="sapUiNoContentPadding"
        title="Allowing Specific Format Only"
      >
        <MessageStrip
          class="sapUiTinyMarginTop sapUiTinyMarginBeginEnd"
          text="Allowed sequence: &lt;em>00000000-a&lt;/em>"
          showIcon="true"
          enableFormattedText="true"
        />
        <form:SimpleForm
          editable="true"
          layout="ResponsiveGridLayout"
          labelSpanM="5"
        >
          <Label text="Restricting inputs via MaskInput" />
          <MaskInput mask="99.999.999-Y">
            <rules>
              <MaskInputRule
                maskFormatSymbol="Y"
                reges="[a-zA-Z0-9]"
              />
            </rules>
          </MaskInput>
          <Label text="Validating inputs via binding type" />
          <Input id="sapMInput" value="{
            path: 'myInput>/value',
            type: 'sap.ui.model.type.String',
            constraints: {
              search: '[0-9]{8,}-[a-zA-Z]'
            }
          }" />
        </form:SimpleForm>
      </Page>
    </App>
  </mvc:View>`,
  afterInit: function() {
    const mySapMInput = this.byId("sapMInput");
    mySapMInput.setModel(new JSONModel({
      value: "",
    }), "myInput");
    sap.ui.getCore().getMessageManager().registerObject(mySapMInput, true);
  },
}).then(view => view.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"
  data-sap-ui-async="true"
  data-sap-ui-theme="sap_belize"
  data-sap-ui-compatversion="edge"
  data-sap-ui-xx-waitfortheme="true"
  data-sap-ui-xx-xml-processing="sequential"
></script>
<body id="content" class="sapUiBody sapUiSizeCompact" style="height: 100%;"></body>

PS:您可能会问为什么定义"9"中的作品mask默认情况下,MaskInput 包含rule /[0-9]/具有maskFormatSymbol "9".


推荐阅读