Hi Guys,
I need to validate below points in input field.
1. Limit upto n number.
2. Only 1 dot allow not more than that
3. No special character.
Currently I am using custom mask for input field but allowing enter multiple dots, also allowing enter multiple '-'. and not able to assign input max length. Please below screenshot.
Please check mask code.
var element = document.getElementById($parameters.inputId);
var maskOptions = {
mask: /[0-9.]$/,
};
var mask = new IMask(element, maskOptions);
Hi Swapnil,
You can use the Text Extension available as a dependencies and use Regex_Serach server action to validate you input box.
Just pass the appropriate Regex pattern with the Text to validate and it will return you a boolean value whether the pattern was found in your concerned input Text.
Also in your client action you can validate the Form to False and give the user a validation message.
Regards,
Nikhil
Below Jscript will use to restrict user to enter n number of dots(single dot is allowed) and only number is allowed to enter inside the field.
var check = function(evt){ var data = document.getElementById('num').value; if((evt.charCode>= 48 && evt.charCode <= 57) || evt.charCode== 46 ||evt.charCode == 0){ if(data.indexOf('.') > -1){ if(evt.charCode== 46) evt.preventDefault(); } }else evt.preventDefault(); }; document.getElementById('num').addEventListener('keypress',check);
here "num" is the id of the input field.
Hope this will help you.
Vipasha
Vipasha Sharma wrote:
Hi Vipasha Sharma,
Can you share how to implement this on mobile keypress event
Hi Swapnil Shinde,
I notice you are using imask js, why not use their Number mask?
You don't say what kind of app you are building, but there are existing components on the forge that you can take a look before implementing your own solution, might save you a lot of trouble too!
Hope this helps!
Jorge Martins wrote:
HI ,
I build an mobile app for finance where user can add and withdraw money as per their convenience so user will put some amount like 1234.89 and after that we will perform further operation. in that case number mask is not usefull i tried with this but not working.
I tried with below code still not working accepting multiple "." and "-" as an input not able to restrict.
I tried with below things code.
1. With Masking : (Not Working)
mask: /^([0-9]+(\.[0-9]+)?)/,
On keypress event i added below script.
var check = function(evt){
//console.log('hii');
//console.log(evt.charCode);
var data = document.getElementById($parameters.In1).value;
if((evt.charCode>= 48 && evt.charCode <= 57) || evt.charCode== 46 ||evt.charCode === 0){
if(data.indexOf('.') > -1){
if(evt.charCode == 46)
evt.preventDefault();
}
if(data.length > 10){
}else{
console.log("call");
document.getElementById($parameters.In1).addEventListener('keypress',check);
console.log(event.charCode);
console.log(event.key);
$resolve();
Console log output.
when i entered any number it shows me event charcode and event key but when i entered anything apart from number then it not able to show charcode and key in console.
Please check below screenshots.
Please suggest me if i am doing wrong.
The Number mask seems to be exactly what you need (decimal numbers), can you tell me what didn't work? I'd still favor that one as it would be less error-prone.
But, on your first approach, I'd say the mask should end with $ before the /, that way you guarantee you match the whole text, not just the beginning (^ means beginning of string and $ means end of string).
$
/
^
Hi Jorge,
I tried number mask but For fixed length working fine but The problem arises when it's not a fixed length.
And i also tried with $ sign also its not working.
please check below url;
https://iifl-dev.outsystemsenterprise.com/PreviewInDevices/?IsMobilePreview=True&DeviceName=Smartphone&URL=/MyInsurance/input?_ts=637370790669714651
In above screenshot first textbox where i uses imask and in second textbox i used number mask.
For fixed length working fine upto one dot when press dot after dot then it fails continually u can enter the numbers. but problem how to use for non fixed decimal value
Could you pls check oml attached by me
Created one client action ValidateAmount and call it on OnReady
Hope this help you!!
Thanks!!
Ajay Sharma wrote:
Hi Ajay,
Update code.
var Validate = function(evt){
//debugger
var data = document.getElementById($parameters.inputId).value;
alert("InputData = "+data+" / Charcode = "+evt.charCode);
if(evt.charCode== 46){
var afterDot = data.substr(data.indexOf('.'));
if(afterDot.length > 2){
// alert(10);
event.preventDefault();
evt.preventDefault();}
alert(10);
document.getElementById($parameters.inputId).addEventListener('keypress',Validate);
I created mobile application named TextInput and above code in it.
Please check below scenarios as i tested.
1. Input type : Text
- Execute on web is working fine,
- Execute in app its totally failed(accepting all character)
1. Input type : Number
- Execute on web is working fine upto one dot when i enter dot after dot then its fail,
- Execute in app its working fine upto one dot when i enter dot after dot then its fail also accept "-" in input field
Here is an web link for test:
https://iifl-dev.outsystemsenterprise.com/PreviewInDevices/?IsMobilePreview=True&DeviceName=Smartphone&URL=/SampleMobile/AmoutInput?_ts=637371546817024870
and download .apk file from here
https://iifl-dev.outsystemsenterprise.com/NativeAppBuilder/App?AppKey=93a3266f-70d8-4536-8c2a-ebc8ec94eca4
Please find the above attachment it work in web emulator and in device as well.
Hope this will help you
HI Vipasha,
Its working fine for data type "Text" but not working for dataType="number" because i want to show only num keyboard once user clicks on text field.
Inside the "On change" action of input box use "TextToInteger()" function for "Regex search result" as shown in snap shot below.