基於第一個AJAX請求調用另一個jQuery/AJAX/PHP請求失敗

我有一個聯繫我們表單與captcha。我提交按鈕點擊我需要執行一個服務器端驗證碼驗證使用第一個AJAX請求，如果成功，然後我打電話給第二個AJAX/Jquery/php發送聯繫我們的郵件。基於第一個AJAX請求調用另一個jQuery/AJAX/PHP請求失敗

但第一個AJAX調用是成功的，但第二個是不是要求..好心幫我在這..

<form 
id="RegisterUserForm" 
name="RegisterUserForm" 
action="" 
onsubmit="return submitform();" 
method="post"> 
    <fieldset 
    style="border: 0;"> 
     <table 
     width="100%"> 
      <tr> 
       <td 
       width="150"> 
        <div 
        class="celebrationContent"> 
         Name:</div> 
         </td> 
         <td 
         class="style1"> 
          <input 
          id="Name" 
          type="text" 
          name="Name" 
          style="border-style: none; background-color: #fffcc4; 
         width: 275px;" 
          /> 
          </td> 
      </tr> 
      <tr> 
       <td> 
        <div 
        class="celebrationContent"> 
         E-mail 
         id:</div> 
       </td> 
       <td 
       class="style1"> 
        <input 
        id="email" 
        type="text" 
        name="email" 
        style="border-style: none; background-color: #fffcc4; 
         width: 274px;" 
        /> 
        </td> 
      </tr> 
      <tr> 
       <td 
       class="celebrationContent"> 
        Phone 
        Number: 
        </td> 
        <td 
        class="style1"> 
         <input 
         id="phonenumber" 
         type="text" 
         name="phonenumber" 
         style="border-style: none; 
         background-color: #fffcc4; width: 274px;" 
         /> 
         </td> 
      </tr> 
      <tr> 
       <td 
       class="celebrationContent"> 
        Your 
        Celebration: 
        </td> 
        <td 
        class="style1"> 
         <input 
         id="yourCelebration" 
         type="text" 
         name="yourCelebration" 
         style="border-style: none; 
         background-color: #fffcc4; width: 274px; height: auto;" 
         /> 
         </td> 
      </tr> 
      <tr> 
       <td 
       class="celebrationContent"> 
        When 
        is 
        it: 
        </td> 
        <td 
        class="style1"> 
         <input 
         type="text" 
         name="datepicker" 
         id="datepicker" 
         style="border-style: none; background-color: #fffcc4; 
         width: 272px;" 
         /> 
         </td> 
      </tr> 
      <tr> 
       <td 
       class="celebrationContent"> 
        Enquiry: 
        </td> 
        <td 
        class="style1"> 
         <input 
         type="text" 
         id="Enquiry" 
         name="Enquiry" 
         style="border-style: none; background-color: #fffcc4; 
         width: 272px; height: 70px;" 
         /> 
         </td> 
      </tr> 
      <tr> 
       <td 
       colspan="2" 
       align="left" 
       class="celebrationContent"> 
        Verification 
        Code 
        </td> 
      </tr> 
      <tr> 
       <td 
       align="left" 
       colspan="2"> 
        <table 
        width="100%"> 
         <tr> 
          <td 
          width="32%"> 
           <img 
           src="captcha.php" 
           alt="celebration captcha" 
           /> 
           </td> 
           <td> 
            <input 
            type="text" 
            id="verificationcode" 
            name="verificationcode" 
            style="border-style: none; 
            background-color: #fffcc4" 
            /> 
           </td> 
         </tr> 
         </table> 
         </td> 
      </tr> 
      <tr> 
       <td 
       colspan="2" 
       align="center"> 
        <input 
        type="submit" 
        id="form_submit" 
        /> 
        </td> 
      </tr> 
      </table> 
      </fieldset> 
      </form>

jQuery代碼是

<script type="text/javascript"> 
     $(function() { 
      $('#datepicker').datepicker('option', 'dateFormat', 'dd-mm-yy');    
     }); 

     $("#datepicker").datepicker({ 
      minDate: 0 
     }); 

    function submitform() { 

     if (validateCaptach()) { 
      var sData = $("#RegisterUserForm").serialize(); 
      alert('i am here to process..'); 
      $.ajax({ 
       type: "POST", 
       url: "thankyou.php", 
       data: sData, 
       //async: false, 
       success: function (data) { 
        if (data == "YESSUCCESS") { 
         alert("Your Query has been sent.."); 
         return true; 
        } else { 
         alert("some error please type again..."); 
         return false; 
        } 
       } 
      }); 
     } 
     return false; 
    } 

    function validateCaptach() { 
     if (validateForm()) { 
      var captchaval = $("#verificationcode").val(); 
      $.ajax({ 
       type: "POST", 
       url: "captchacheck.php", 
       async: false, 
       data: { 
        verificationcode: captchaval 
       }, 
       success: function (data) { 
        if (data == "SUCCESS") { 
         alert("captchacheck success.."); 
         return true; 
        } else { 
         alert("The security code you typed was wrong. Please try again."); 
         return false; 
        } 
       } 
      }); 
     } 
    } 

    function validateForm() { 

     if (document.RegisterUserForm.Name.value == "") { 
      alert("Please provide your name!"); 
      document.RegisterUserForm.Name.focus(); 
      return false; 
     } 

     if (document.RegisterUserForm.email.value == "") { 
      var emailID = document.RegisterUserForm.email.value; 
      atpos = emailID.indexOf("@"); 
      dotpos = emailID.lastIndexOf("."); 
      if (atpos < 1 || (dotpos - atpos < 2)) { 
       alert("Please enter correct email ID") 
       document.RegisterUserForm.email.focus(); 
       return false; 
      } 
     } 

     if ((document.RegisterUserForm.phonenumber.value == "") || isNaN(document.RegisterUserForm.phonenumber.value)) { 
      alert("Please enter your phone Number"); 
      document.RegisterUserForm.phonenumber.focus(); 
      return false; 
     } 
     if (document.RegisterUserForm.yourCelebration.value == "") { 
      alert("Please enter your Celebration!"); 
      document.RegisterUserForm.yourCelebration.focus(); 
      return false; 
     } 
     if (document.RegisterUserForm.datepicker.value == "") { 
      alert("Please select date !"); 
      document.RegisterUserForm.datepicker.focus(); 
      return false; 
     } 
     if (document.RegisterUserForm.Enquiry.value == "") { 
      alert("Please Enter your enquiry!"); 
      document.RegisterUserForm.Enquiry.focus(); 
      return false; 
     } 
     if (document.RegisterUserForm.verificationcode.value == "") { 
      alert("Please enter the Verificationcode!"); 
      document.RegisterUserForm.verificationcode.focus(); 
      return false; 
     } 
     return (true); 
    }  

    </script>

來源

2013-07-02 user601140

'validateCaptach（）'沒有'return'語句。從'success'函數返回不會從'validateCaptach'返回。 – Barmar

我也試過這種方式..我們需要分配一個變量，在返回值將被分配和返回..請正確。 – user601140

這不是我在答案中顯示的內容嗎？ – Barmar

你沒有從validateCaptach()返回任何東西。您從AJAX回調函數返回true或false，但這些值不會在任何位置。

function validateCaptach() { 
    if (validateForm()) { 
     var captchaval = $("#verificationcode").val(); 
     var success; 
     $.ajax({ 
      type: "POST", 
      url: "captchacheck.php", 
      async: false, 
      data: { 
       verificationcode: captchaval 
      }, 
      success: function (data) { 
       if (data == "SUCCESS") { 
        alert("captchacheck success.."); 
        success = true; 
       } else { 
        alert("The security code you typed was wrong. Please try again."); 
        success = false; 
       } 
      } 
     }); 
     return success; 
    } 
}

來源

2013-07-02 05:46:45 Barmar

是的Barmar，我只是更新了代碼。儘管如此，它只顯示唯一的警報「captchacheck成功」的消息..請 – user601140

我不知道爲什麼。對不起，但我沒有太多使用同步'.ajax（）'的經驗，也許它不會像我想象的那樣工作。你最好使用鏈接回調的答案之一，而不是試圖同步返回值。 – Barmar

非常感謝它的工作。哦，我的上帝，你節省了我的時間。謝謝羅伯茨。 – user601140

您還沒有返回值從你的validateCaptach。來自success事件的返回值不會以您處理代碼的方式返回給調用函數。所以爲了讓你獲得所需的輸出。您必須在ajax致電的success事件中撥打第二個電話。

例如

..... 
    success: function(e) { 
     callSecondFunction(); 
    }

這將是最好的辦法。

來源

2013-07-02 05:44:50 DevZer0

他有'async：false'，所以它不是異步的。 – Barmar

謝謝更正。： - ] – DevZer0

我不明白你爲什麼使用這兩個AJAX請求。這並不意味着。

您可以在單個AJAX調用中驗證所有內容。請做驗證碼檢查和表格提交 captchacheck.php

來源

2013-07-02 05:45:46 Wishnu

當你與異步調用的工作，該函數的AJAX調用之前validateCaptcha完成完成。您需要在第一個ajax調用成功返回後發送第二個ajax調用。

<script type="text/javascript"> 
$(function(){ 
    $('#datepicker').datepicker('option', 'dateFormat', 'dd-mm-yy');    
}); 

$("#datepicker").datepicker({ 
    minDate: 0 
}); 

function submitform() { 
    /** 
    * Pass the second ajax call as a function 
    */ 
    validateCaptcha(function(){ 
     var sData = $("#RegisterUserForm").serialize(); 
     alert('i am here to process..'); 

     $.ajax({ 
      type: "POST", 
      url: "thankyou.php", 
      data: sData, 
      //async: false, 
      success: function (data) { 
       if (data == "YESSUCCESS") { 
        alert("Your Query has been sent.."); 
        return true; 
       } 
       else { 
        alert("some error please type again..."); 
        return false; 
       } 
      } 
     }); 
    }); 

    return false; 
} 

function validateCaptcha (action) { 
    if (validateForm()) { 
     var captchaval = $("#verificationcode").val(); 

     $.ajax({ 
      type: "POST", 
      url: "captchacheck.php", 
      async: false, 
      data: { 
       verificationcode: captchaval 
      }, 
      success: function (data) { 
       if (data == "SUCCESS") { 
        alert("captchacheck success.."); 

        if (typeof action == "function") { 
         action(); 
        } 

        return true; 
       } 
       else { 
        alert("The security code you typed was wrong. Please try again."); 
        return false; 
       } 
      } 
     }); 
    } 
} 

function validateForm() { 
    if ($("#RegisterUserForm [name=Name]").val() == "") { 
     alert("Please provide your name!"); 
     $("#RegisterUserForm [name=Name]").focus(); 
     return false; 
    } 

    if ($("#RegisterUserForm [name=email]").val() == "") { 
     var emailID = $("#RegisterUserForm [name=email]").val(); 
     atpos = emailID.indexOf("@"); 
     dotpos = emailID.lastIndexOf("."); 

     if (atpos < 1 || (dotpos - atpos < 2)) { 
      alert("Please enter correct email ID") 
      $("#RegisterUserForm [name=email]").focus(); 

      return false; 
     } 
    } 

    if (($("#RegisterUserForm [name=phonenumber]").val() == "") || isNaN($("#RegisterUserForm [name=phonenumber]").val())) { 
     alert("Please enter your phone Number"); 
     $("#RegisterUserForm [name=phonenumber]").focus(); 

     return false; 
    } 

    if ($("#RegisterUserForm [name=yourCelebration]").val() == "") { 
     alert("Please enter your Celebration!"); 
     $("#RegisterUserForm [name=yourCelebration]").focus(); 

     return false; 
    } 

    if ($("#RegisterUserForm [name=datepicker]").val() == "") { 
     alert("Please select date !"); 
     $("#RegisterUserForm [name=datepicker]").focus(); 

     return false; 
    } 

    if ($("#RegisterUserForm [name=Enquiry]").val() == "") { 
     alert("Please Enter your enquiry!"); 
     $("#RegisterUserForm [name=Enquiry]").focus(); 

     return false; 
    } 

    if ($("#RegisterUserForm [name=verificationcode]").val() == "") { 
     alert("Please enter the Verificationcode!"); 
     $("#RegisterUserForm [name=verificationcode]").focus(); 

     return false; 
    } 

    return true; 
} 
</script>

來源

2013-07-02 05:59:02

基於第一個AJAX請求調用另一個jQuery/AJAX/PHP請求失敗

回答

相關問題