I am trying to check two conditions: if second value is less than or equal to first then true else throws errors and if first value is not there then the second value should be read-only like below snippet. But when I enter two digits eg: 12 in the first number and single digits eg: 4 in second numbers, then alert is popped up saying errors. Where did I do wrong?
$(document).on('change', '.first, .second', calculate);
function calculate() {
var first = $('.first').val();
var second = $('.second').val();
//alert([first, second]);
if (first != '') {
$('.second').prop('readonly',false);
} else {
$('.second').prop('readonly',true);
}
if (second > first) {
alert('Second value should be less than or equal to first value');
$('.second').val(0);
}
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>First</label><br>
<input type="number" min="0" class="first" id="first">
<br>
<br>
<label>Second</label><br>
<input type="number" min="0" readonly class="second" id="second">If I enter single digits at both then errors are not there, play the above snippet and you'll understand the problem.. Thanks in advance
