Ossama Benbouidda Ossama Benbouidda - 1 year ago 111
AngularJS Question

Prevent the letter 'e' and dots from being typed in an input number

I have a simple input number like this:

<input type="number"/>

When trying to input anything other than a number or the letter "e", it doesn't work, but when I type the letter "e" it works.

I checked w3.org specs, and it states clearly that floating numbers can be typed using the normal notation (ex : 10.2) or the scientific notation (ex : 1e2).

So my question is : Is there a way to prevent the user from typing e letters and dots. Said in another way : Is there a way to make the input number accept ONLY INTEGER NUMBERS ?

I have the idea of doing that with an Angular directive that I will input as an attribute to my input number, but I really don't know how to make that work.

EDIT : What I would like to do is to simulate the same behaviour that we have now when trying to type any other letter in the alphabet other than "e", or ".". What I want to say is that I do not want to see the letter appearing in the input (Like it is the case now).

Answer Source

You are correct that it should be done with a directive. Simply create a directive and attach it to the input. This directive should listen for keypress and/or keydown events. Possibly paste events as well. If the char entered is an 'e' or dot -- call event.preventDefault();

angular.module('app', [])
  .directive('yrInteger', yrInteger);

function yrInteger() {
  return {
    restrict: 'A',
    link: function(scope, element, attrs) {
      element.on('keypress', function(event) {

        if ( !isIntegerChar() ) {
        function isIntegerChar() {
          return /[0-9]|-/.test(

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download