We Keep Coding

How to restrict the user to not enter more than 8 numbers?

here is my implementation
//I restrict the user to enter number only
if (isNaN(e.target.value)) {
e.target.value = e.target.value.substring(0, e.target.value.length - 1)
e.target.type = 'number'
}
// here I forced the user to enter only 8 numbers
if (e.target.value?.length > 8) {
e.target.value = e.target.value.substring(0, 8)
}
The above code works sometime sometime not. I need an alternative. is there any alternative that would be great. Thanks

You can use String's substr method, to extract only 1st 8 characters, if length of input is greater than 8.
You also need to set max="99999999" on input so that input doesn't go beyond 99999999 upon clicking <input>'s arrows.
let input = document.querySelector(".num");
input.addEventListener("input", ()=>{
if(input.value.length > 8){
input.value = input.value.substr(0,8);
}
});
<input type="number" max="99999999" class="num">

Why dont you make it simpler
<input type="number" onKeyPress="if(this.value.length==8) return false;" max="99999999"/>
type ="number" are used to let the user enter a number. They include built-in validation to reject non-numerical entries.
learn more here

How to automatically add comma on amount displayed in input field if the customer clicked a button with specified amount?

The customer may click a button with specified amount and the amount would display in input field. I'm trying to automatically add a comma on the displayed amount but it's only working if the amount is typed. What would be the easiest way to do it?
<input type="number" class="input-char-amo" id="d-total" step="10000" value="0" min='10000' max="5000000" / required>
https://codepen.io/Cilissaaa/pen/vYYGjYB

You could use toLocaleString() method. It returns a string with a language-sensitive representation of a number.
let n = 1000000;
n.toLocaleString(); //"1,000,000"

chek it once. Hope it helps.
I have found the solution on this link: Can jQuery add commas while user typing numbers?
$('input.number').keyup(function(event) {
// skip for arrow keys
if(event.which >= 37 && event.which <= 40) return;
// format number
$(this).val(function(index, value) {
return value
.replace(/\D/g, "")
.replace(/\B(?=(\d{3})+(?!\d))/g, ",")
;
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input class="number">

Convert int with starting zeros to string to check length

I have an html input type="number" field in an html page. like this:
<input type="number">
To validate the form I need to check that the length of this field is exactly 3. To do this I convert the number to String and execute the length() function.
The problem comes when the number starts with a zero. like 065
In that case the toString() method outputs a 65 with a length of 2
Do you have any idea on how to get the correct length of the number ?

I think that you would have to have your input type as text and then use JavaScript to get the length for validation. After that you could convert it to a number using the Number() function.

Change the input type to text and restrict the input with a pattern and maxlength:
<input type="text" pattern="\d*" maxlength="3">

You can solve this one of two ways:
When the user moves focus away from the field, remove the leading zeroes
In the validation, remove the leading zeroes then check the length
There is no need to convert to a number.
Removing leading zeroes when focus is lost:
function truncateNumericInput(event) {
event = event || window.event;
event.target = event.target || event.srcElement;
if (event.target.nodeName != "INPUT" || event.target.type != "number") {
return;
}
var input = event.target,
value = event.target.value;
input.value = value.indexOf(".") > -1
? value.replace(/^0{2,}/, "0")
: value.replace(/^0+/, "");
}
if (document.addEventListener) {
document.addEventListener("blur", truncateNumericInput, true);
} else {
document.attachEvent("focusout", truncateNumericInput);
}
JSFiddle: http://jsfiddle.net/67jyg1d9/
Removing leading zeroes during validation
var regex = /^0+/;
var value = input.value.replace(regex, "");
console.log(value.length <= 3)

<input type="number" name="quantity" min="0" max="999">
this takes care that only number can be entered and only till 999 that's 3 digits at max

You can solve your problem by using input type as number. You can build your logic by using overflow and underflow as shown below.
<input id="numtest" type="number" min="10" max="20" />
document.getElementById('numtest').validity.rangeOverflow
document.getElementById('numtest').validity.rangeUnderflow
or
document.getElementById('numtest').checkValidity();
rangeUnderflow: return true if value is less then min
rangeOverflow: return true if value is greater than max value.

jQuery: how to set fixed decimals for input field value

I have a basic input field in which an amount is to be filled in.
The field is formatted as text as it also has to work with older browser versions.
Is there a way I can use jQuery and/or Regex to set fixed decimals (2) to any number in this field ?
I tried the following but this doesnt change anything:
<input type="text" class="span6" id="amount" maxlength="12" name="amount" />
$('#amount').on('blur', function() {
var amount = $('#amount').val().replace(/^\s+|\s+$/g, '');
if( ($('#amount').val() != '') && (!amount.match(/^\d+$/) ) {
$('#amount').val( amount.toFixed(2) );
}
});
What I am looking for is a way to add two decimals to the input value if there are none and the input is a number.
Examples:
1000 should become 1000.00
1000.99 should stay 1000.99 as there are already two decimals.
Many thanks for any help with this, Tim.

I have created a fiddle, please check Fiddle
before using toFixed convert the amount to integer parseInt(amount).
Edit
Code
$('#amount').on('blur', function() {
var amount = $('#amount').val().replace(/^\s+|\s+$/g, '');
if( ($('#amount').val() != '') && (!amount.match(/^$/) )){
$('#amount').val( parseInt(amount).toFixed(2));
}
});

Validate at client to accept only numbers between 1 to 100 in a textbox using JavaScript

Validate at client to accept only numbers in a gridview textbox using JavaScript.
I have a gridview with two labels and one textbox. all I want is user should enter the textbox value 1-100. how can I do this in ASP.Net.

//Html
<input type="text" name="textboxId" id="textboxId"/>
//Javascript
var val = document.getElementById('textboxId').value;
if(val < 1 || val > 100){
alert('Value must be between 1 and 100');
return false;
}

Depending on what browsers you want to support, you might not need to write any JavaScript. HTML5 added some new input types including type=number which supports min and max attributes.
Support is patchy at the moment, but maybe this will help you.

Well you could add the onkeydown and validate the input. If you dont want it, return false;
node.onkeydown = function(a_event)
{
// validate non number input
if ((a_event.keyCode >= 65 && a_event.keyCode <= 90))
return false;
};
In addition you can parseInt the input and return false as well

Try this
<asp:TextBox ID="Num" runat="server"></asp:TextBox>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" ForeColor="DarkOrange" ValidationExpression="^[1-9][0-9]?$|^100$" ControlToValidate="Num" runat="server" ErrorMessage="accept only numbers between 1 to 100"></asp:RegularExpressionValidator>