沒有阻止POST到MVC控制器的onclick驗證

我試圖整合realex支付API，並已用在https://developer.realexpayments.com/#!/integration-api/3d-secure/java/html_js#3dsecurity-accordion，併爲這我已成立了以下頁面的部分發現的例子：沒有阻止POST到MVC控制器的onclick驗證

<!DOCTYPE html> 
<html> 
<head> 
    <title>Basic Validation Example</title> 
    <script src="~/Scripts/jquery-1.10.2.js"></script> 
    <script src="~/Scripts/rxp-js.js"></script> <!-- Available at https://github.com/realexpayments --> 
    <!-- Basic form styling given as an example --> 
    <style type="text/css"> 
     label { 
      display: block; 
      font-size: 12px; 
      font-family: arial; 
     } 

     input { 
      width: 200px; 
     } 

      input.small { 
       width: 50px; 
      } 

     .twoColumn { 
      float: left; 
      margin: 0 30px 20px 0; 
     } 

     .clearAll { 
      clear: both; 
     } 
    </style> 
</head> 
<body> 
    <!-- Basic HTML form given as an example --> 
    <form name="myForm" method="POST" autocomplete="off" action="securepayment"> 
     <p> 
      <label for="cardNumber">Card Number</label> 
      <input type="text" id="cardNumber" name="card-number" /> 
     </p> 
     <p> 
      <label for="cardholderName">Cardholder Name</label> 
      <input type="text" id="cardholderName" name="cardholder-name" /> 
     </p> 
     <p class="twoColumn"> 
      <label>Expiry Date</label> 
      <input type="text" id="expiryDateMM" name="expiry-date-mm" aria-label="expiry date month" placeholder="MM" class="small" /> 
      <input type="text" id="expiryDateYY" name="expiry-date-yy" aria-label="expiry date year" placeholder="YY" class="small" /> 
     </p> 
     <p class="twoColumn"> 
      <label for="cvn">Security Code</label> 
      <input type="text" id="cvn" name="cvn" class="small" /> 
     </p> 
     <p class="clearAll"> 
      <input value="Pay Now" type="submit" name="submit" onclick="validate();" /> 
     </p> 
    </form> 
    <script> 
     // Basic form validation using the Realex Payments JS SDK given as an example 
     function validate() { 
      alert("VALIDATE HIT !!!!") 
      var cardNumberCheck = RealexRemote.validateCardNumber(document.getElementById('cardNumber').value); 
      var cardHolderNameCheck = RealexRemote.validateCardHolderName(document.getElementById('cardholderName').value); 
      var expiryDate = document.getElementById('expiryDateMM').value.concat(document.getElementById('expiryDateYY').value) ; 
      var expiryDateFormatCheck = RealexRemote.validateExpiryDateFormat(expiryDate); 
      var expiryDatePastCheck = RealexRemote.validateExpiryDateNotInPast(expiryDate); 
      if (document.getElementById('cardNumber').value.charAt(0) == "3") { cvnCheck = RealexRemote.validateAmexCvn(document.getElementById('cvn').value);} 
      else { cvnCheck = RealexRemote.validateCvn(document.getElementById('cvn').value); } 
      if (cardNumberCheck == false || cardHolderNameCheck == false || expiryDateFormatCheck == false || expiryDatePastCheck == false || cvnCheck == false) 
      { 
       // code here to inform the cardholder of an input error and prevent the form submitting 
       if (cardNumberCheck == false) { alert("CARD IS FALSE") } 
       if (cardHolderNameCheck == false) { alert("CARD HOLDER NAME IS FALSE") } 
       if (expiryDateFormatCheck == false) { alert("EXPIRY DATE FORMAT IS FALSE") } 
       if (expiryDatePastCheck == false) { alert("EXPIRY DATE IS IN THE PAST") } 
       if (cvnCheck == false) { alert("CVN IS FALSE") } 
       return false; 
      } 
      else 
       return true; 
     } 
    </script> 
</body> 
</html>

儘管保證JavaScript正在按預期工作我已經檢查過，看到相應的驗證消息正在警報中顯示，但是，儘管導致返回錯誤的onclick（）事件導致控制器的帖子不會被取消

Can任何人都知道爲什麼會發生這種情況，或者我做錯了什麼？

來源

2016-08-22 Jay

你在'submit'按鈕的'onclick'事件中嘗試過'return validate（）'嗎？ –

嗨大衛，這是我的問題傻我:)謝謝 – Jay

添加它作爲答案，我會標記爲正確的感謝 – Jay

嘗試將您的onclick事件處理程序從onclick="validate();"改爲onclick="return validate();"即可解決此問題。

希望這有助於！

來源

2016-08-22 15:25:10

沒有阻止POST到MVC控制器的onclick驗證

回答

相關問題