60
Views
6
Comments
Solved
How to restrict lower case character in input field?
Question
Application Type
Reactive

Hi,

 I want to create an input field that accepts only uppercase characters. If a user tries to input a lowercase character, the input field should prevent it from being typed.
Thanks and regards

Ved

2024-05-14 05-39-17
Jothikarthika - EONE
Solution

Hi  Vednarayan

Write this script within the 'onready' function of the screen. 

Refer to this link for the demo  DemoLink

document.getElementById($parameters.Inputboxid).addEventListener("keydown", function(event) {  if (event.key === event.key.toLowerCase()) {    event.preventDefault();  }});


Thanks,

Jothikarthika

2021-03-18 21-03-15
Benjith Sam
 
MVP

Hi Vednarayan,

One of the possible solution is to register the input widget keypress event handler with the following definition to restrict lowercase characters.

JS Snippet: InputJSTask

document.getElementById($parameters.InputWidget_Id).addEventListener('keypress', function(event){
    // Get the character code of the key that was pressed
    let charCode = event.charCode;

    // Check if the character is a lowercase letter
    if (charCode >= 97 && charCode <= 122) {
        event.preventDefault();
    }
});

(source: Google search)

I hope this helps!


Kind regards,

Benjith Sam

2021-11-12 04-59-31
Manikandan Sambasivam

if (event.key >= 'a' && event.key <= 'z') {  

              event.preventDefault();             

   let uppercaseKey = event.key.toUpperCase();             

   inputField.value += uppercaseKey;        

    } 

The keypress event listener prevents lowercase characters from being typed and replaces them with their uppercase counterparts immediately. 

2022-07-05 06-54-15
GOKULPRASANTH MUNUSAMY

Hi Vednarayan, 

   Try to use this regex code in JS.


document.addEventListener('DOMContentLoaded', function() {

    var inputField = document.getElementById($parameters.InputField);


    inputField.addEventListener('input', function(event) {

        var value = inputField.value;

        var newValue = value.replace(/[a-z]/g, ''); // Remove lowercase letters

        if (newValue !== value) {

            inputField.value = newValue;

        }

    });

});

Thanks,

Gokulprasanth M

2023-12-14 09-56-57
Yogesh Javir

Hey @Vednarayan 

*If you want to convert whatever user entered into upper case then use buildin function 

ToUpper("First string") = "FIRST STRING"

*If want to prevent entering lower case character in input then try solution suggested by @Benjith Sam 

2024-12-10 04-40-04
Gitansh Anand

Hi @Vednarayan, you try my component Restrict Characters, here is the demo.

Thanks
Gitansh Anand

2024-05-14 05-39-17
Jothikarthika - EONE
Solution

Hi  Vednarayan

Write this script within the 'onready' function of the screen. 

Refer to this link for the demo  DemoLink

document.getElementById($parameters.Inputboxid).addEventListener("keydown", function(event) {  if (event.key === event.key.toLowerCase()) {    event.preventDefault();  }});


Thanks,

Jothikarthika

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.