Lặp qua các trường nhập để xác thực bằng cách sử dụng Jquery mỗi()

Question

Tôi đang tạo biểu mẫu và chỉ muốn mã thực thi nếu các giá trị đầu vào là số. Tôi đang cố gắng tránh sử dụng một số loại plugin xác nhận và đã tự hỏi nếu có một cách để lặp qua các lĩnh vực đầu vào và kiểm tra các giá trị.

Tôi đã cố gắng sau nhưng tôi nghĩ logic của tôi là sai:

(#monthlyincome là id hình thức)

$("#submit").click(function() { 

    $("#monthlyincome input").each(function() { 

     if (!isNaN(this.value)) { 
     // process stuff here 

     } 

    }); 

}); 

Bất kỳ ý tưởng?

Đây là toàn bộ cập nhật mã:

$("#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 là một chức năng cho ... định dạng số. :)

Answer 1

Vâng thử nghiệm ở đây này chỉ hoạt động tốt:

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

trên một hình thức tìm kiếm như thế này:

<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> 

Di chuyển trả về false khi bạn thấy phù hợp với

Chỉnh sửa: liên kết đến mã được gửi vào biểu mẫu OP http://pastebin.com/UajaEc2e

Answer 2

value là một chuỗi. Bạn cần phải cố gắng chuyển đổi nó thành một số đầu tiên. Trong trường hợp này đơn giản đơn nhất + sẽ làm các trick:

if (!isNaN(+this.value)) { 
    // process stuff here 
} 

Answer 3

Dựa trên Sondre (Cảm ơn bạn! Sondre) ví dụ trên, tôi đã phát triển một mẫu trong Fiddle để Folks có thể hiểu rõ hơn nhiều để thực hiện

Ví dụ: Click Here

$("#submit").on("click", function() { 
 
    var isValid = []; 
 
    var chkForInvalidAmount = []; 
 
    $('.partialProdAmt').each(function() { 
 
    if ($.trim($(this).val()) <= 0) { 
 
     isValid.push("false"); 
 
    } else { 
 
     isValid.push("true"); 
 
    } 
 
    if ($.isNumeric($(this).val()) === true) { 
 
     chkForInvalidAmount.push("true"); 
 
    } else { 
 
     chkForInvalidAmount.push("false"); 
 
    } 
 
    }); 
 
    if ($.inArray("true", isValid) > -1) { 
 
    if ($.inArray("false", chkForInvalidAmount) > -1) { 
 
     $(".msg").html("Please enter Correct format "); 
 
     return false; 
 
    } else { 
 
     $(".msg").html("All Looks good"); 
 
    } 
 
    } else { 
 
    $(".msg").html("Atlest One Amount is required in any field "); 
 
    return false; 
 
    } 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<form method="post" action="" id="myForm"> 
 
    <input type="text" class="partialProdAmt" value="0" /> 
 
    <input type="text" class="partialProdAmt" value="0" /> 
 
    <input type="text" class="partialProdAmt" value="0" /> 
 
    <input type="text" class="partialProdAmt" value="0" /> 
 
    <input type="button" value="Send" id="submit" /> 
 
</form> 
 
<div class="msg"></div>