I am working on a regex for allowing only max 10 digits before ma and max 3 digits after ma.
So far i have e up with this:
^[1-9]{1}[0-9]{1,9}(,[0-9]{0,3})?$.
I am going to validate input in javascript.
I am using sap.m.input control, and user's keystroke is captured on live change event.
Following examples are accepted as user input:
1234567890,123
4,1
234,45
56457
Input must always begin with a natural number and only ma should be appear.
Using the above mentioned regex, i am able to avoid first digit as zero but it is not considering this input value - 1,23
.
I have added the following code in the application:
var input = oEvent.getSource().getValue();
var isValid = false;
var regex = /^[1-9]{1}[0-9]{1,9}(,[0-9]{0,3})?$/;
isValid = regex.test(input);
if (isValid == false) {
// oEvent.getSource().setValueState("Error");
input = input.replace(/[^[1-9]{1}[0-9]{1,9}(,[0-9]{0,3})]/g,"");
oEvent.getSource().setValue(input);
return;
}
I also want to avoid blank entry and space in the input field. I want replace unwanted characters with space on live change event. As of now, i am unable to replace other characters using the above mentioned code.
Please suggest ways to form perfect regex to handle this scenario.
Thanks.
I am working on a regex for allowing only max 10 digits before ma and max 3 digits after ma.
So far i have e up with this:
^[1-9]{1}[0-9]{1,9}(,[0-9]{0,3})?$.
I am going to validate input in javascript.
I am using sap.m.input control, and user's keystroke is captured on live change event.
Following examples are accepted as user input:
1234567890,123
4,1
234,45
56457
Input must always begin with a natural number and only ma should be appear.
Using the above mentioned regex, i am able to avoid first digit as zero but it is not considering this input value - 1,23
.
I have added the following code in the application:
var input = oEvent.getSource().getValue();
var isValid = false;
var regex = /^[1-9]{1}[0-9]{1,9}(,[0-9]{0,3})?$/;
isValid = regex.test(input);
if (isValid == false) {
// oEvent.getSource().setValueState("Error");
input = input.replace(/[^[1-9]{1}[0-9]{1,9}(,[0-9]{0,3})]/g,"");
oEvent.getSource().setValue(input);
return;
}
I also want to avoid blank entry and space in the input field. I want replace unwanted characters with space on live change event. As of now, i am unable to replace other characters using the above mentioned code.
Please suggest ways to form perfect regex to handle this scenario.
Thanks.
Share edited Nov 15, 2017 at 8:52 eli-k 11.4k11 gold badges44 silver badges47 bronze badges asked Nov 15, 2017 at 7:55 sannysanny 731 gold badge4 silver badges12 bronze badges 1- Even without model and data binding, StepInput might be very helpful for you to guide and restrict the user from typing invalid values. Regex is a powerful tool but should not be overused especially if there is already an alternative way to solve the problem. – Boghyon Hoffmann Commented Nov 15, 2017 at 13:59
4 Answers
Reset to default 4^[1-9]\d{0,9}(,\d{0,3})?$
[1-9]
- first number must be 1-9\d{0,9}
- after first number, there can be 0 - 9 digits,\d{0,3}
- 3 more digits after ma()?
- the ma part is optional
Try this online: https://regex101./r/YsaXvo/1
You can even go further if you want to accept negative numbers:
^-?[1-9]\d{0,9}(,\d{0,3})?$
by accepting the - in the beginning of your string.
Last but not least, I would remend using trim before checking the validity of your input! users tend to add unnecessary spaces at the end or even at the beginning of what they input.
Good luck
You is almost ok, except of not allowing 1 number before a, and starting minus.
Try this one:
var regex = /^-?[1-9][0-9]{0,9}(,[0-9]{0,3})?$/;
Since you're using SAPUI5 / OpenUI5, take a look at what the framework already offers. E.g.: It is remended to use the control StepInput
instead of a plain Input
for your scenario:
- It allows only numbers with support of decimal values.
- It supports
min
andmax
values. - It removes unwanted characters such as whitespaces.
- It replaces blank entry (with
min
value). - Additionally, it supports easy stepping with keyboard and scroll wheel as well.
Here is an example showcasing the above mentioned criteria. Optionally, we can also set a model on the control and bind the data to the value
so that UI5 handles saving the value only when certain conditions are met. For this, we're using the type Float
with the respective constraints:
sap.ui.getCore().attachInit(() => sap.ui.require([
"sap/ui/core/mvc/XMLView",
"sap/ui/model/json/JSONModel",
"sap/ui/core/Core",
], async (XMLView, JSONModel, Core) => {
"use strict";
const control = await XMLView.create({
definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
height="100%"
displayBlock="true">
<App>
<Page class="sapUiResponsiveContentPadding" showHeader="false">
<StepInput xmlns:core="sap.ui.core"
core:require="{ 'FloatType': 'sap/ui/model/type/Float' }"
textAlign="Center"
width="14rem"
displayValuePrecision="3"
step="0.1"
min="1"
max="9999999999.999"
value="{
path: '/data',
type: 'FloatType',
constraints: {
minimum: 1,
maximum: 9999999999.999
}
}"/>
<ObjectAttribute title="Model data" text="{/data}" />
</Page>
</App>
</mvc:View>`,
models: new JSONModel({
"data": 1.0,
}),
});
Core.getMessageManager().registerObject(control, true);
control.placeAt("content");
}));
<script id="sap-ui-bootstrap"
src="https://openui5nightly.hana.ondemand./resources/sap-ui-core.js"
data-sap-ui-libs="sap.ui.core,sap.m"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-async="true"
data-sap-ui-patversion="edge"
data-sap-ui-xx-waitfortheme="init"
></script>
<body id="content" class="sapUiBody sapUiSizeCompact"></body>
We can see that the model doesn't save the value if the value was invalid (e.g. "-1.000").