30
Views
9
Comments
Solved
How to limit the input with number type
Question

Hi,

I am using reactive web. I have used input widget with number type, I have to set the maximum length 5, but maximum length property is not available for number type it is only available for text type.

Rank: #112
Solution

Hello Shrinjala,

I did various tests on this matter and I believe that I've found a solution for you :)


On the OnReady event of your screen, you can create an Event Listener for your Input Element using JavaScript.

document.getElementById("Input_Number").addEventListener("input", function() {
  Input_Number.value = Input_Number.value.slice(0, 5);
});


Basically, I'm using input event to control the allowed maximum length for that element using slice function. This will allow you to maintain your Input Type defined as Number.

Please refer to attached OML file.


Hope that this helps you!


Kind regards,

Rui Barradas

NumberMaximumLenght5.oml

mvp_badge
MVP
Rank: #18

Hi,

That is correct you have to validate the entered value yourself. So let's say max length 5 then you can check in value <= 99999. Alternatively you could also validate the input using regular expression.

Regards,

Daniel

Rank: #614

Hi,

Yes for "Number" type input field there is no provision to set the maximum length of the valus.

You can solve this problem using below steps:

- Use a action in "OnChanges" of the input field .

-Inside the action use "Regex Search" as shown in snap shot below

-Assign the value of "Regex Pattern" to the variable which is bind with you input field

Hope this will help you

Regards,

Vipasha

mvp_badge
MVP
Rank: #71

Hi Shrinjala,

You can try the following proposed solution with the use of some Javascript that runs on the onKeyDown event of the Input field.

Regards,

Nordin

Rank: #91

Hi Shrinjala, 

can you share oml with us so can find whats the problem in your case if this solution is not working.


Regards

Rahul

Rank: #112
Solution

Hello Shrinjala,

I did various tests on this matter and I believe that I've found a solution for you :)


On the OnReady event of your screen, you can create an Event Listener for your Input Element using JavaScript.

document.getElementById("Input_Number").addEventListener("input", function() {
  Input_Number.value = Input_Number.value.slice(0, 5);
});


Basically, I'm using input event to control the allowed maximum length for that element using slice function. This will allow you to maintain your Input Type defined as Number.

Please refer to attached OML file.


Hope that this helps you!


Kind regards,

Rui Barradas

NumberMaximumLenght5.oml