We Keep Coding

Javascript number comparison with negative value doesn't work

I try to compare a negative value with "0" and that doesn't seem to work.
var number = Number.parseInt($(this).val());
var min = Number.parseInt($(this).attr('min'));
var max = Number.parseInt($(this).attr('max'));
Here's my condition :
if (min && $(this).prop('required')) {
if (number < min) {
alert('ok');
fail = true;
}
}
My min value is 0 and my number is -1.
It never enters the condition. Why?

0 is a falsy value. It will never enter the if condition if min is 0 .
All the following conditions will be sent to else blocks
if (false)
if (null)
if (undefined)
if (0)
if (NaN)
if ('')
if ("")
if (``)
Since the return value of parseInt is either a number or NaN, you can use isNaN instead:
if(!isNaN(min) && $(this).prop('required')) {
// your code
}

Since min is 0, your condition evaluates to false. You have two options, one is to check the string value before parsing it:
if($(this).attr('min').trim() && $( this ).prop('required')) {
if (number < min) {
alert('ok');
fail = true;
}
}
The other is to check for NaN after parsing the number since parsing an empty string will return NaN:
if(!isNaN(min) && $( this ).prop('required')) {
if (number < min) {
alert('ok');
fail = true;
}
}
console.log(' '.trim() == false);
console.log(!isNaN(Number.parseInt('')) == false);

Your condition:
if(min && $( this ).prop('required'))
Would evaluate to false since min has a value of 0 and 0 && anything would be false

(0 && true ) return zero in JavaScript.
see first comment for more details

javascript limit on positive and negative number with delimiter comma based onkeyup and onkeypress

Today i have problem in delimiting number for negative and positive number. For example, i have a textbox to insert my number and the result after write the number. Suddenly the number is separated with comma delimiter like this either the number is positive or negative
eg : 1000 -> 1,000
-1000 -> -1,000
-1000.12 -> -1,000.12
-0.00001 -> -0.00001
How to achieve this using javascript, what i know is using onkeypress and onkeyup. Thank you very much :)

This is not the best solution, but you can implement this according to your need.
var msg = document.getElementById('myInputBox'),
numberPattern = /^[0-9]+$/;
msg.addEventListener('keyup', function(e) {
msg.value = getFormattedData(msg.value);
});
function checkNumeric(str) {
return str.replace(/\,/g, '');
}
Number.prototype.format = function() {
return this.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,");
};
function getFormattedData(num) {
var i = checkNumeric(num),
isNegative = checkNumeric(num) < 0,
val;
if (num.indexOf('.') > -1) {
return num;
}
else if (num[num.length - 1] === ',') {
return num;
}
else if(i.length < 3) {
return i;
}else {
val = Number(i.replace(/[^\d]+/g, ''));
}
return (isNegative ? '-' : '') + val.format();
}
<input type="text" id='myInputBox' value="" />

allow only 0-100 percent values in textbox

I have a percentage textbox. I want to enter values 0 to 100. Not more than 100 or negative values.
FIDDLE
Please check this fiddle. Here, it is allowing only 2 digit values like 99 only and after 99 it is allowing number of decimals(99..........9999) like this. Need to allow only one decimal point and I can enter 100 also.
Note :
Can Enter 0 to 100 and not negative and not more than 100.00
After decimal I want to enter only 2 digits like, 99.99 only.
Do not allow negative values.
Allow only one decimal point like(9.99 or 99.99). Not (9.......9..9...80099 or 99.......9......9).
<script>
function check(e,value){
//Check Charater
var unicode=e.charCode? e.charCode : e.keyCode;
if (value.indexOf(".") != -1)if( unicode == 46 )return false;
if (unicode!=8)if((unicode<48||unicode>57)&&unicode!=46)return false;
}
function checkLength(){
var fieldVal = document.getElementById('txtF').value;
//Suppose u want 3 number of character
if(fieldVal < 100){
return true;
}
else
{
var str = document.getElementById('txtF').value;
str = str.substring(0, str.length - 1);
document.getElementById('txtF').value = str;
}
}
</script>
<input id="txtF" type="number" onKeyPress="return check(event,value)" onInput="checkLength()" />
<p id="s"></p>
Please help me how can I do this using jQuery or JavaScript.

Updated fiddle. This solves it for now, but the use of step=0.01 may not be what you want. Setting the step to 0.01 allows us to check the validity state of the input.
The validitiy state is not updated an a "before" event so on an "after" event we rollback the input.
<input id="txtF" type="number" onInput="return check(event,value)" min="0" max="100" step="0.01" />
check = function (e,value){
if (!e.target.validity.valid) {
e.target.value = value.substring(0,value.length - 1);
return false;
}
var idx = value.indexOf('.');
if (idx >= 0 && value.length - idx > 3) {
e.target.value = value.substring(0,value.length - 1);
return false;
}
return true;
}

<script>
var point=false;
var count=0;
function check(e,value){
//Check Charater
debugger;
if(count==3)return false;
var unicode=e.charCode? e.charCode : e.keyCode;
if( unicode == 46 && point==true)
return false;
if( unicode == 46 && point==false)
{
point=true;
}
if (unicode!=8)if((unicode<48||unicode>57)&&unicode!=46)return false;
if(point==true)count++;
}
function checkLength(){
var fieldVal = document.getElementById('txtF').value;
//Suppose u want 3 number of character
if(fieldVal <= 100){
return true;
}
else
{
var str = document.getElementById('txtF').value;
str = str.substring(0, str.length - 1);
document.getElementById('txtF').value = str;
}
}
</script>
<input id="txtF" type="number" onKeyPress="return check(event,value)" onInput="checkLength()" />
<p id="s"></p>
http://jsfiddle.net/ySt7S/130/

validate input with decimal precision and scale

I am trying to create a javascript function which is called on keypress event on a input which does the following:
Input should be a valid decimal with format (5,2) => (XXXXX.YY) which are variable to the function. Input is restricted if user adds any value which does not conform to the format above.
If existing input starts with . append 0 to the starting automatically
HTML
<input type="text" onkeypress="return checkDecimal(event, this, 5, 2);" id="price2" value="27.15">
Javascript
function checkDecimal(evt, item, lenBeforeDecimal, lenAfterDecimal) {
var charCode = evt.which;
var trimmed = $(item).val().replace(/\b^0+/g, "");
if(checkStartsWith(trimmed, '.') == true){
trimmed = '0' + trimmed;
}
//Allow following keys
//8 = Backspace, 9 = Tab
if(charCode == 8 || charCode == 9){
return true;
}
//Only a single '.' is to be allowed
if(charCode == 46){
var dotOccurrences = (trimmed.match(/\./g) || []).length;
if(dotOccurrences != undefined && dotOccurrences == 1){
return false;
}else{
return true;
}
}
if (charCode > 31 && ((charCode < 48) || (charCode > 57))) {
return false;
}
if ($(item).val() != trimmed){
$(item).val(trimmed);}
//Check the start and end length
if(trimmed.indexOf('.') == -1){
if(trimmed.length >= parseInt(lenBeforeDecimal)){
return false;
}
}else{
var inputArr = trimmed.split(".");
if(inputArr[0].length > parseInt(lenBeforeDecimal) || inputArr[1].length >= parseInt(lenAfterDecimal)){
return false;
}
}
return true;
}
function checkStartsWith(str, prefix){
return str.indexOf(prefix) === 0;
}
Issues
If user inputs 12345.9 and then moves the caret position after 5, user is able to add another digit before the decimal 123456.9 which should not be allowed.
If user inputs 1.9 and then remove 1 and add 5, 5 is added at the end and the entered value becomes 0.95 and not 5.9
JS Fiddle

Consider using a regular expression like:
/^(\d{0,5}\.\d{0,2}|\d{0,5}|\.\d{0,2})$/;
that allows everything up to and including your required format, but returns false if the number part is more than 5 digits or if the fraction is more than 2 digits, e.g.:
<input type="text" onkeyup="check(this.value)"><span id="er"></span>
<script>
function check(v) {
var re = /^(\d{0,5}\.\d{0,2}|\d{0,5}|\.\d{0,2})$/;
document.getElementById('er').innerHTML = re.test(v);
}
</script>
You'll need separate validation for the final value, e.g.
/^\d{5}\.\d{2}$/.test(value);
to make sure it's the required format.
I don't understand the requirement to add a leading zero to "." since the user must enter 5 leading digits anyway (unless I misunderstand the question).

checking for integer input on button click

I am trying to get this Javascript in my application working.
function validateQuantity(field)
{
var value = field.value; //get characters
//check that all characters are digits, ., -, or ""
for(var i=0; i < field.value.length; ++i)
{
var new_key = value.charAt(i); //cycle through characters
if(((new_key <= "0") || (new_key > "9")) &&
!(new_key == ""))
{
alert("Please enter number and greater than 0 only");
return false;
break;
}
return true;
}
}
And I have a input button as below
<input class="buttonToLink" type="submit" value="Update"
onclick="return validateQuantity(document.getElementById('quantity'))"/>
The above code successfully checks the input of all alphabet such as "abc" or alphabet and numeric such as "abcd123" as false.
However, when I put numeric characters first, along with alphabet such as "123abc", it fails -- it does not show the alert.
What did I do wrong with the code, and how can it be fixed?

function validateQuantity(field) {
if (!/^\d+$/.test(field.value)) { // is an integer
alert("Please enter number and greater than 0 only");
return false;
}
return true;
}
The reason your code doesn't work is because you have the return true statement inside the loop. As soon as it sees a valid integer it will return true and break out of the function, ignoring anything that comes after it. Allowing strings like "123abc" for example.
This is probably what you wanted:
function validateQuantity(field)
{
var value = field.value; //get characters
//check that all characters are digits, ., -, or ""
for(var i=0; i < field.value.length; ++i)
{
var new_key = value.charAt(i); //cycle through characters
if(((new_key <= "0") || (new_key > "9")) &&
!(new_key == ""))
{
alert("Please enter number and greater than 0 only");
return false;
break;
}
}
return true;
}

if (parseInt(new_Key) == new_Key) {
//valid
} else { // it will return NaN
//invalid
}

Try parsing the value as an integer, and compare with the original value.
var isAllNumbers = (parseInt(field.value) == field.value);
Perhaps use a jQuery selector, and use a regex to test for numeric.
var isAllNumbers = $("#quantity").val().match(/\d+$/);