LessThan and LessThanEqual methods don't work correctly for negative numbers
Author: Laura-GuilloryCreated Apr 16, 2018Updated Feb 8, 2025
LabelsType: BugAdditional MethodsStatus: Verified
Subject of the issue
When negative numbers are entered in an input field with a lessThan or lessThanEqual rule applied, the form will pass validation when it shouldn't, and fail validation when it should pass - as if the rule was actually greaterThan. What seems to be happening is that the absolute value is used (-1 is treated as 1, for example). So if we have -2 compared to -1, -1 is treated as being "less than" -2, even though -2 < -1.
Your environment
- version of
jquery-validate: Current repository, not released yet - which browser and its version: Firefox 60.0b11, also tested on Chrome 65.0.3325.181
Steps to reproduce
lessThan with negative numbers:
- Open the following HTML file
- Enter -2 and -1 in the two input fields respectively
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<form id="form">
<input id="A" name="A" type="number" value="" /><br />
<input id="B" name="B" type="number" value="" /><br />
<input type="submit" value="Submit" />
</form>
</body>
</html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="jquery-validation/jquery.validate.js"></script>
<script src="jquery-validation/additional-methods.js"></script>
<script>
$("#form").validate({
rules: {
A: {
lessThan: "#B"
}
}
});
</script>lessThanEqual with negative numbers:
- Open the following HTML file
- Enter -2 and -1 in the two input fields respectively
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<form id="form">
<input id="A" name="A" type="number" value="" /><br />
<input id="B" name="B" type="number" value="" /><br />
<input type="submit" value="Submit" />
</form>
</body>
</html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="jquery-validation/jquery.validate.js"></script>
<script src="jquery-validation/additional-methods.js"></script>
<script>
$("#form").validate({
rules: {
A: {
lessThanEquals: "#B"
}
}
});
</script>Expected behaviour
In both instances, I would expect validation to pass, since -2 < -1.
Actual behaviour
Validation fails with the message: "Please enter a lesser value." If the numbers are swapped, validation will pass which is incorrect.
Source: jquery-validation/jquery-validation