web-dev-qa-db-fra.com

jquery: valide que le champ de texte est numérique

J'ai un problème simple - je voudrais vérifier un champ pour voir si c'est un entier s'il n'est pas vide. Je n'utilise aucun plugin supplémentaire, juste jQuery. Mon code est le suivant:

if($('#Field').val() != "")
{
    if($('#Field').val().match('^(0|[1-9][0-9]*)$'))
    {
        errors+= "Field must be numeric.<br/>";
        success = false;
    }
}

... Cela ne semble pas fonctionner. Où vais-je mal?

L'erreur que je reçois est val() is not an object.

UPDATE: Il s'est avéré que le vrai problème était que j'avais mon nom d'élément et non l'id.

22
George Johnston

Cela devrait marcher. Je voudrais couper le blanc du champ de saisie d'abord:

if($('#Field').val() != "") {
    var value = $('#Field').val().replace(/^\s\s*/, '').replace(/\s\s*$/, '');
    var intRegex = /^\d+$/;
    if(!intRegex.test(value)) {
        errors += "Field must be numeric.<br/>";
        success = false;
    }
} else {
    errors += "Field is blank.</br />";
    success = false;
}
22
karim79

Regex n'est pas nécessaire, ni les plugins

if (isNaN($('#Field').val() / 1) == false) {
    your code here
}
26
motomod

Je sais qu'il n'est pas nécessaire d'ajouter un plugin pour cela. Mais cela peut être utile si vous faites beaucoup de choses avec les chiffres. Donc checkout this plugin au moins pour la connaissance . Rest karim79 answer is super cool.

    <!DOCTYPE html>
    <html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
        <script type="text/javascript" src="jquery.numeric.js"></script>
    </head>
    <body>
        <form>
            Numbers only:
            <input class="numeric" type="text" />
            Integers only:
            <input class="integer" type="text" />
            No negative values:
            <input class="positive" type="text" />
            No negative values (integer only):
            <input class="positive-integer" type="text" />
            <a href="#" id="remove">Remove numeric</a>
        </form>
        <script type="text/javascript">
        $(".numeric").numeric();
        $(".integer").numeric(false, function() { alert("Integers only"); this.value = ""; this.focus(); });
        $(".positive").numeric({ negative: false }, function() { alert("No negative values"); this.value = ""; this.focus(); });
        $(".positive-integer").numeric({ decimal: false, negative: false }, function() { alert("Positive integers only"); this.value = ""; this.focus(); });
        $("#remove").click(
            function(e)
            {
                e.preventDefault();
                $(".numeric,.integer,.positive").removeNumeric();
            }
        );
        </script>
    </body>
    </html>
4
Mohit Jain

Je ne sais pas quand cela a été mis en œuvre, mais vous pouvez actuellement utiliser http://api.jquery.com/jQuery.isNumeric/

if($('#Field').val() != "")
{
    if($.isNumeric($('#Field').val()) {
        errors+= "Field must be numeric.<br/>";
        success = false;
    }
}
3
CrypticGuru

Validation de base avec utilisation par classe

$('.IsInteger,.IsDecimal').focus(function (e) {
    if (this.value == "0") {
        this.value = "";
    }
});
$('.IsInteger,.IsDecimal').blur(function (e) {
    if (this.value == "") {
        this.value = "0";
    }
});

$('.IsInteger').keypress(function (e) {
    var charCode = (e.which) ? e.which : e.keyCode;
    if (charCode > 31
    && (charCode < 48 || charCode > 57))
        return false;
});
$('.IsDecimal').keypress(function (e) {
    var charCode = (e.which) ? e.which : e.keyCode;
    if (this.value.indexOf(".") > 0) {
        if (charCode == 46) {
            return false;
        }
    }
    if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
});
$('.IsSpecialChar').keypress(function (e) {
    if (e.keyCode != 8 && e.keyCode != 46 && e.keyCode != 37 && e.keyCode != 38 && e.keyCode != 39 && e.keyCode != 40)
        return false;
    else
        return true;
});
$('.IsMaxLength').keypress(function (e) {
    var length = $(this).attr("maxlength");
    return (this.value.length <= length);
});

$('.IsPhoneNumber').keyup(function (e) {
    var numbers = this.value.replace(/\D/g, ''),
    char = { 0: '(', 3: ') ', 6: ' - ' };
    this.value = '';
    for (var i = 0; i < numbers.length; i++) {
        this.value += (char[i] || '') + numbers[i];
    }
});
$('.IsEmail').blur(function (e) {
    var flag = false;
    var email = this.value;
    if (email.length > 0) {
        var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
        flag = regex.test(email);
    }
    if (!flag)
        this.value = "";
});

Exemple:-

il suffit de mettre le nom de la classe en entrée

0
Sadik Ali

Vous n'avez pas besoin de regex pour celui-ci. Utilisez la fonction javascript isNAN().

La fonction isNaN () détermine si une valeur est un nombre illégal (Pas un nombre). Cette fonction renvoie true si la valeur est NaN et faux sinon.

if (isNaN($('#Field').val()) == false) {

  //it's a number
}
0
Jijo John