In many Oracle APEX applications, we come across page items that should accept only numbers. Typical examples are mobile numbers, quantities, PIN codes, or numeric IDs. While APEX provides number item types, users can still paste or enter invalid characters in some cases.
Using a small JavaScript snippet, we can strictly restrict page items to accept numeric values only.
This article explains a simple and reliable approach using JavaScript and jQuery.
Why Not Rely Only on Item Type?
Setting a page item as Number Field helps, but it does not fully prevent:
Copy-paste of non-numeric values
Unexpected characters from some keyboards
Browser-specific behaviour
Client-side validation using JavaScript improves user experience and reduces bad input before submit.
Basic Requirement
Allow digits 0–9
Remove any non-numeric characters automatically
Prevent invalid key presses while typing
JavaScript Solution
You can use the following JavaScript code to restrict input to numeric values only.
Step 1: Assign a CSS Class
Assign a CSS class to your page item:
allow_numeric
You can do this from:
Page Item → Advanced → CSS Classes
Step 2: Add JavaScript Code
Place the below code in:
Page → JavaScript → Execute when Page Loads or
Global Page → JavaScript (if reused across pages)
$(“.allow_numeric”).on(“input”, function (evt) {
var self = $(this);
// Remove any non-numeric characters
self.val(self.val().replace(/D/g, “”));
// Block non-numeric key input
if (evt.which < 48 || evt.which > 57) {
evt.preventDefault();
}
});
How This Works
Let’s break it down simply:
.allow_numeric Targets all page items having this CSS class.
on(“input”, …) Triggers on typing, pasting, or autofill.
replace(/D/g, “”) Removes everything except digits.
evt.which < 48 || evt.which > 57 ASCII range check for numeric characters (0–9).
This combination ensures that even pasted content is cleaned instantly.
Why This Approach Is Reliable
Works across modern browsers
Handles paste and manual typing
No server round-trip needed
Can be reused for multiple items
Lightweight and easy to maintain
Common Use Cases
Mobile number fields
OTP or PIN inputs
Quantity and count fields
Numeric codes without decimals
Optional Enhancements
If required, you can extend this logic to:
Allow decimals
Limit length
Show inline error messages
Combine with server-side validation
#orclapex
The post Prevent Numeric Input Only in Oracle APEX Page Items Using JavaScript appeared first on Ontoor blogs.
