条带结帐不验证必填字段答案

【问题标题】：stripe checkout doesn't validate required fields条带结帐不验证必填字段
【发布时间】：2016-06-26 03:25:24
【问题描述】：

Stripe checkout 未验证 required 输入字段。

必填字段：

<input type="tel" name="appointment[patient_phone]" id="appointment_patient_phone" required="required" placeholder="Phone Number">

当我点击stripe 按钮时，stripe checkout popup 出现并且表单未被验证。

所以我尝试添加自定义验证器，但 stopPropagation 无法正常工作，因为 stripe checkout popup 在调用 alert 和 stopPropagation 后仍会弹出

function validateAppointmentForm() {

  var validateForm = function(event) {
    debugger;
    var phone = $('#appointment_patient_phone').val();
    if (!phone) {
      alert("Phone number is required.");
      event.preventDefault();
      event.stopPropagation();
    }
  }

  var watchStripeButton = function() {
    debugger;
    $("#new-appt-stripe-button").on("click", validateForm);
  }

  debugger;
  watchStripeButton();

}
;

【问题讨论】：

标签： javascript jquery validation stripe-payments

【解决方案1】：

您应该在此处改用Custom Checkout。这允许您在打开 Checkout 之前拥有自己的按钮并在表单中添加验证。

当客户点击您的支付按钮并输入他的卡详细信息时，您会检测到某些字段未正确填写或具有无效值并显示错误。如果表单验证通过，您可以在点击处理程序中调用 handler.open()。

【讨论】：