单击 eWAY paynow 按钮时如何验证表单

Question

我已经在表单中创建了 eway paynow 按钮。

    <form action="?" method="POST">
  Name: <input type="text" name="customer_name" value="" />

  <script src="https://secure.ewaypayments.com/scripts/eCrypt.js"
   class="eway-paynow-button" 
  data-publicapikey="epk-6AEE4269-0010-4415-A327-8064928AEFD0"
  data-amount="0"
  data-currency="AUD" 
  data-allowedit="true"
  data-resulturl="http://example.com/responseMsg.php">
</script>

</form>

我需要检查 customer_name 字段是否为空，然后再加载 eway 付款形式。如果 customer_name 字段为空，请不要加载 eway 付款 form.how 我要这样做吗？我可以运行 javascript 验证此表单吗？

Answer 1

“立即付款”按钮在打开付款表单之前不提供运行函数的挂钩，目前也不使用事件侦听器。这里的解决方法是：

捕获原始的 onclick 处理程序
添加一个执行验证的新事件侦听器，如果成功则调用原始的 onclick。

为此我坚持使用纯 JS，jQuery 将允许更清晰的实现:-)

另请注意，我已删除 data-resulturl 属性并将 URL 移至表单标记，否则 window 可能只是重定向而不提交。

<form action="http://example.com/responseMsg.php" method="POST">
  Name: <input type="text" name="customer_name" value="" />

  <script src="https://secure.ewaypayments.com/scripts/eCrypt.js"
   class="eway-paynow-button" 
  data-publicapikey="epk-6AEE4269-0010-4415-A327-8064928AEFD0"
  data-amount="10"
  data-currency="AUD" 
  data-allowedit="true"
  data-submitform="yes">
</script>

</form>

<script>

  window.onload = function() {
    // Find the eWAY Pay Now button - note getElementsByClassName is IE9+
    var ewayButton = document.getElementsByClassName("eway-button")[0];

    // save and remove old onclick
    var oldeWAYclick = ewayButton.onclick;
    ewayButton.onclick = null;

    // Add new listener with validation
    ewayButton.addEventListener("click", function(e){ 
        // Stop form from submitting itself
        e.preventDefault();

        // Example validation
        var name = document.forms[0]["customer_name"].value;
        if (name == null || name == "") {
            alert("Please complete all fields");
            return;
        }   
        // Display payment form
        oldeWAYclick();
    }, false);
  };

</script>

单击 eWAY paynow 按钮时如何验证表单

how to validate form when click eWAY paynow button

javascript

forms

jquery

payment-gateway