0

これが私のjQueryスニペットです

 $("#firstBankDetail").hide();
       $("#secondBankDetail").hide();
       $("#thirdBankDetail").hide();
       $("#fourthBankDetail").hide();
       $("#noOfBankDetails").change(function(){
           var value = $(this).val();

           if(value == 0) {
               $("#firstBankDetail").hide();
               $("#secondBankDetail").hide();
               $("#thirdBankDetail").hide();
               $("#fourthBankDetail").hide();
           }
           else if(value == 1) {
               $("#firstBankDetail").show();
               $("#secondBankDetail").hide();
               $("#thirdBankDetail").hide();
               $("#fourthBankDetail").hide();  
           }
           else if(value == 2) {
               $("#firstBankDetail").show();
               $("#secondBankDetail").show();
               $("#thirdBankDetail").hide();
               $("#fourthBankDetail").hide(); 
           }
           else if(value == 3){
               $("#firstBankDetail").show();
               $("#secondBankDetail").show();
               $("#thirdBankDetail").show();
               $("#fourthBankDetail").hide();  
           }
           else if(value == 4){
               $("#firstBankDetail").show();
               $("#secondBankDetail").show();
               $("#thirdBankDetail").show();
               $("#fourthBankDetail").show();
           }

        }); 

これは bankDetails ベースのnoOfBankDetails ドロップダウンを示しています。

bankDetail次に送信中に、示されているように可視に検証を適用しました

   $('form').submit(function (event) {
       if($('#firstBankDetail').is(':visible')) {
           if(!validateFirstBankDetails()){
               event.preventDefault();
               return false;
           }
        } 

       if($('#secondBankDetail').is(':visible')) {
          if(!validateSecondBankDetails()){
           event.preventDefault();
           return false;
          }
        }   
       if($('#thirdBankDetail').is(':visible')) {
           if(!validateThirdBankDetails()){
               event.preventDefault();
               return false;
           }
        }   
       if($('#fourthBankDetail').is(':visible')) {
           if(!validateFourthBankDetails()){
               event.preventDefault();
               return false;
           }
        }
   });

これは完全に正常に機能します。ただし、値 4 へのドロップダウンを選択し、任意のフィールドの 4 番目の詳細で、double が期待される場所に文字列を入力し、再度 2 へのドロップダウンを選択すると問題が発生します。次に、送信をクリックします。その場合、検証は 2 つに対してのみ実行されますが、4 つすべてのデータがサーバーに送信され、NumberFormatException.

任意のソリューション???

編集:含める

function validateFirstBankDetails(){
    var bankDetails0_nameOfBank = document.getElementById("bankDetails0_nameOfBank");
    var bankDetails0_nameOfBranch = document.getElementById("bankDetails0_nameOfBranch");
    var bankDetails0_accountNumber = document.getElementById("bankDetails0_accountNumber");
    var bankDetails0_accountType = document.getElementById("bankDetails0_accountType");

    var bankDetails0_EMIforProposedLoan = document.getElementById("bankDetails0_EMIforProposedLoan");

    if(bankDetails0_accountNumber.value == ""){
        alert("Please Enter the Account No");
        bankDetails0_accountNumber.setAttribute("style","background-color: #ffcccc");   
        return false;
    }

    if(bankDetails0_accountType.value == ""){
        alert("Please Select the Account Type");
        bankDetails0_accountType.setAttribute("style","background-color: #ffcccc");   
        return false;
    }

    if(bankDetails0_EMIforProposedLoan.value == ""){
        alert("Please Enter the EMI for proposed loan");
        bankDetails0_EMIforProposedLoan.setAttribute("style","background-color: #ffcccc");   
        bankDetails0_EMIforProposedLoan.focus();
        return false;
    }
    if(isNaN(bankDetails0_EMIforProposedLoan.value)){
        alert("Proposed EMI must be number only !");
        bankDetails0_EMIforProposedLoan.setAttribute("style","background-color: #ffcccc");   
        return false;
    }

    return true;
}
4

0 に答える 0