We Keep Coding

Character limit with just numbers in Angular 8

In a <input type="number"> I have to limit the numbers that can be entered to 7. Moreover, on Chrome I am able to input just numbers, but not on Firefox or IE.
<input type="number" id="myInputNumber" name="myInputNumber" [pattern]="myPattern"
[(ngModel)]="myModel" maxlength="7" #fooModel="ngModel">
I know that type number are not supported on Firefox, so there is a function that allows me to reach the goal on all three browsers?

maxlength is ignored on type="number" by design.
You'll have to implement a custom directive.
Here's a tutorial you can follow.

how to allow input type number to accept alphabet

I want to enter full width number and turn it into half width using jquery but first I need it to accept characters that are not number.
<input id="text1" step="0.5" type="number" value="" name="text1">
I need type number because I want the step feature.

You can't make a type="number" field accept non-numeric characters. If you want to do that, you'll need to use type="text". (If you need the step feature, you'll have to implement it.)

If you want your text filed to accept floating numbers. Use following Input.
<input type="number" step="any" name="text1" value="">

How to only allow the numbers 0-5 in <input> fields with AngularJS?

I have an input field like this:
HTML
<input ng-model="newtodo.effort" ng-enter="addTodo()" type="number" min="0" max="5"
maxlength="1" size="1" step="1" class="form-control marginBottom"
placeholder="Aufwand" aria-describedby="basic-addon2" required></input>
JavaScript/Angular controller
$scope.addTodo(todo) {
restservice.addTodo(todo); // Does call to REST service backend
}
In the input field above I only want to allow integer values 0, 1, 2, 3, 4 and 5.
Not allowed are floats (e.g. 1.4), characters (e.g. foo) and values less than 0 or bigger than 5.
The input field may not be empty!
As you can see I am already using HTML5 input attributes for this but I know that I cannot rely on those. Additionally I also check server-side if the values entered are valid against my restrictions. So far so good, but in order to increase usability and responsiveness of my web app I also want to validate these values in JavaScript using AngularJS. How would I do that? I know that I could implement complicated value checks in $scope.addTodo(todo) and then output error messages to the user if the values he/she entered weren't ok but I somehow "feel" that there is a better, easier "angularish" way using RegEx and a 1-liner? If so, please explain to me how to do this the Angular way. Thanks!

You can add the following attribute to your input field.
ng-pattern="/^[0-5]+$/"
And validate as such:
function formCtrl($scope) {
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app ng-controller="formCtrl">
<form name="myForm">
<input type="number" ng-model="newtodo.effort" name="effort" ng-pattern="/^[0-5]$/" ng-enter="addTodo()" step="1" class="form-control marginBottom" placeholder="Aufwand" aria-describedby="basic-addon2" required>
<span ng-show="myForm.effort.$error.pattern">The number must be between 0-5</span>
<span ng-show="myForm.effort.$error.number">No characters allowed</span>
<span ng-show="myForm.effort.$error.required && !myForm.effort.$error.number">The field is required</span>
</form>
</div>

You can use ngPattern to set the regular expression which you want to validate against.
Reffer to the docs for more details: https://docs.angularjs.org/api/ng/directive/input

Validate 0.5 as Step Value in HTML5 Number Input

I want to have an input field which only allows to type whole numbers or .5 decimal numbers. e.g. 0, 0.5, 1, 1.5, 2, 2.5.......etc etc
I am trying to do this with a HTML5 input field as so
<input type="number" min="0" max="18" step="0.5" pattern="\d+" />
but it won't validate the number when it is on a half step of 0.5. It just stays red when clicking outside / validating.
Is this possible? I can't find similar example of how to validate for half steps. DO I need to use jQuery to achieve this?
Thanks
Fiddle Demo http://jsfiddle.net/b8NrE/906/

Remove the pattern attribute. This is used for complex validation that requires regular expressions (and your regular expression is only matching sequences of digits). As it is, stipulating min, max, and step already define all the validation that you need:
<input type="number" min="0" max="18" step="0.5" />
http://jsfiddle.net/b8NrE/907/

You can try this: It will clear text box if step is not .5
<input type="number" min="0" oninput="validity.valid||(value='');" step="0.5" />

Mobile Safari - How to Default to Full Numeric Keypad for Decimal Entry w/o type="number", or disable Safari input type="number" correction

I have a fairly basic but frustrating problem, essentially I've been trying to force input fields to behave more like text input types (where they do not correct incorrect number entries, such as "0..7" to truncate to "0") and just let JS form validation and backend validation do its job. However, while I want to allow the user to enter whatever they want in the field (input type="text"), I want to FULL numberpad keyboard to display.
Original:
<input type="number" name="test" class="answers" id="mileage" value="0.0" maxlength=5 />
Attempts to fix:
Works on iPad, but NOT on iPods, as iPods display the compact number pad WITHOUT decimal points:
<input type="text" name="test" class="answers" id="mileage" value="0.0" maxlength=5 pattern="\d*"/>
Doesn't work on iPod, as it displays the full text keyboard, but doesn't default to the "number side" of the full keyboard with a decimal:
<input type="text" name="test" class="answers" id="mileage" value="0.0" maxlength=5 pattern="\d+(\.\d*)?"/>
Anyone have any ideas? Either to prevent Mobile Safari from correcting input number types (number types display the correct keyboard on iPods and iPads, but has built in correction on fields when the keyboard hides), or to force the keyboard to be on the Number side of the full iPod keyboard?
FYI:
This sounds very similar to my issue, however I may need a different solution. Sounds like they desired the "Full" numeric keyboard to appear by default but without number autoformatting that Safari does on the field when entering other characters in.
Force a numeric keyboard but allow punctuation: HTML5, mobile Safari

I know this is old but I see this being asked quite a lot.
To prevent validation of the number input type (and other types) you can use the novalidate attribute on the <form> element:
<form novalidate>
<input type="number" name="test" class="answers" id="mileage" value="0.0" maxlength=5>
</form>
You'll still get the numeric keyboard but it won't force the user to enter numbers only.