Looping through input fields for validation using Jquery each()

102,840

Solution 1

Well testing here this works just fine:

$(function() {
    $("#submit").click(function() {
        $("#myForm input[type=text]").each(function() {
            if(!isNaN(this.value)) {
                alert(this.value + " is a valid number");
            }
        });
        return false;
    });
});

on a form looking like this:

<form method="post" action="" id="myForm">
    <input type="text" value="1234" />
    <input type="text" value="1234fd" />
    <input type="text" value="1234as" />
    <input type="text" value="1234gf" />
    <input type="submit" value="Send" id="submit" />
</form>

Move the return false around as you see fit

Edit: link to code sdded to OPs form http://pastebin.com/UajaEc2e

Solution 2

The value is a string. You need to try to convert it to a number first. In this case a simple unitary + will do the trick:

if (!isNaN(+this.value)) {
  // process stuff here
}
Share:
102,840
Alex Berg
Author by

Alex Berg

Updated on July 31, 2022

Comments

  • Alex Berg
    Alex Berg almost 2 years

    I'm making a form and would like the code to execute only if the input values are numbers. I'm trying to avoid using some kind of validation plugin and was wondering if there is a way to loop through the input fields and check for the values.

    I've been trying the following but I think my logic is wrong:

    (#monthlyincome is the form id)

    $("#submit").click(function() {
    
      $("#monthlyincome input").each(function() {
    
           if (!isNaN(this.value)) {
           // process stuff here
    
           }
    
       });
    
    });
    

    Any ideas?

    This is the whole updated code:

    $("#submit").click(function() {
    
        $("#monthlyincome input[type=text]").each(function() {
            if (!isNaN(this.value)) {
                // processing data      
                var age         = parseInt($("#age").val());
                var startingage = parseInt($("#startingage").val());
    
                if (startingage - age > 0) { 
    
                    $("#field1").val(startingage - age);
                    $("#field3").val($("#field1").val());
    
                    var inflationyrs    = parseInt($("#field3").val());
                    var inflationprc    = $("#field4").val() / 100;
                    var inflationfactor = Math.pow(1 + inflationprc, inflationyrs);
                    $("#field5").val(inflationfactor.toFixed(2)); 
    
                    var estyearlyinc    = $("#field6").val();
                    var inflatedyearlyinc = inflationfactor * estyearlyinc;
                    $("#field7").val(FormatNumberBy3(inflatedyearlyinc.toFixed(0), ",", "."));
    
                    var estincyears = $("#field2").val();
                    var esttotalinc = estincyears * inflatedyearlyinc;
                    $("#field8").val(FormatNumberBy3(esttotalinc.toFixed(0), ",", "."));
    
                    var investmentrate   = $("#field9").val() / 100;
                    var investmentfactor = Math.pow(1 + investmentrate, inflationyrs);
                    $("#field10").val(investmentfactor.toFixed(2));
    
                    var currentsavings = $("#field11").val();
                    var futuresavings  = currentsavings * investmentfactor;
                    $("#field12").val(FormatNumberBy3(futuresavings.toFixed(0), ",", "."));
    
                    //final calculations
                    var futurevalue = (1 * (Math.pow(1 + investmentrate, inflationyrs) - 1) / investmentrate);
                    var finalvalue = (1 / futurevalue * (esttotalinc - futuresavings));
    
                    $("#field13").val(FormatNumberBy3(finalvalue.toFixed(0), ",", "."));
    
                }
                // end processing
            }
        });
    
    });
    

    FormatNumberBy3 is a function for... formatting the numbers. :)