I want to do a quantity validation using Jquery. I want to check for following
1) that the number is a whole number
2) that it not letter
3) that they is not decimal
4) that the max number is 99.
My current Jquery
$(document).ready(function()
{
$('#button').click(function()
{
var pid = $('#pid').val();
var length = $('#length').val();
var Qty = $('#Qty').val(); // this is the quantity
var Category = $('#Category').val();
#Qty = preg_replace('#[^0-9]#i', '', $Qty); // filter everything but numbers
if ($Qty >= 100) { $Qty = 99; }
if ($Qty < 1) { $Qty = 1; }
if ($Qty == "") { $Qty = 1; }
$.ajax({
url: 'cart.php',
type: 'POST',
data: { pid:pid, length:length, Qty:Qty, Category:Category },
success: function(data)
{
}
})
});
});
Please note that any validation you do with JavaScript (with or without jQuery) should be repeated in your PHP code (obviously the syntax won't be the same), because you can't ever completely trust what is submitted by the browser (the user might have used dev tools to bypass your client-side validation).
Having said that, to answer your question on how to do the validation you've described with jQuery, given a variable Qty
holding the user input you can test whether it is an integer between 1 and 99 using the following code:
if (!/^[1-9]\d?$/.test(Qty)){
alert('Add meaningful error message here');
return false;
}
The regex I've shown, ^[1-9]\d?$
, allows the first character in the string to be a digit between 1 and 9, and then an optional second character that is any digit (0-9). Which works out to all of the numbers between 1 and 99. (Actually that was just plain JS, not jQuery.)
In the context of your existing code:
$(document).ready(function () {
$('#button').click(function () {
var pid = $('#pid').val();
var length = $('#length').val();
var Qty = $('#Qty').val(); // this is the quantity
var Category = $('#Category').val();
if (!/^[1-9]\d?$/.test(Qty)){
alert('Add meaningful error message here');
return false; // don't continue
}
$.ajax({
url: 'cart.php',
type: 'POST',
data: {
pid: pid,
length: length,
Qty: Qty,
Category: Category
},
success: function (data) {
}
});
});
});
Note that the PHP code that you showed in your question (that you later edited into the middle of your JS) doesn't make sense because it actually changes the value entered by the user to force it to meet the rules. E.g., user types "15.0" so your code removes the decimal to leave "150" and then decides that that is too big and makes it "99". So the user thinks they've sent you "15.0" and you've changed it to "99".
Note also that if you know that 99 is the largest permitted number then you can add maxlength="2"
to the input element in question so that the user can't type more than two characters.
Doing it by math (allowing for notations like "0.1 E2" and so on)
// cast to a number
var n = Number(Qty.replace(/^\s+/, '').replace(/\s+$/, ''));
if (!isNaN(n)) {
// force to nearest integer in bounds
n = Math.max( 1, Math.min( 99, Math.round(n) ) );
}
else {
//not a number
}
try this and let me know whether works or not :
first you need to check whether the input is number or not
if(isNaN(Qty))
{
alert("Not a Number");
return false;
}
next ever if its a float(which means decimal) you can simply change it to a integer by doing the following
Qty = parseInt(Qty); //so 1.5 becomes 1
next you simply make a checking whether Qty is between >= 1 and <= 99
if(Qty < 1 || Qty > 99)
{
alert("The number must be between 1 and 99");
return false;
}
I hope this satisfy all your conditions Amy.