Question

我已经审核了几个帖子Link 1 link 2。

我正在使用stripe.js，我想通过一个按钮提交我的自定义表单和其他表单以及其他信息。我们的想法是发送两个不同的消息，一个发送给客户端，另一个发送给服务提供商。

我希望能够通过make payment按钮（或此时的任何表格）提交两个表单，这样我就可以在控制器/模型中选择名称作为索引，然后发送电子邮件，通知两者各方关于交易的不同事情。

问题是，条带处理javascript上提交的所有表单，我对如何将它与我自己的AJAX请求结合起来感到困惑，以便同时发送两个表单。

这是我现在在我的视图中的JS代码，如果我这样做，则不会创建令牌并且不会完成任何操作：

function stripeResponseHandler(status, response) {

    // Grab the form:

    var $form = $('#payment-form');

    if (response.error) { // Problem!

      // Show the errors on the form:

      $form.find('.payment-errors').text(response.error.message);

      $form.find('.submit').prop('disabled', false); // Re-enable submission

    } else { // Token was created!

      // Get the token ID:

      var token = response.id;  

      // Insert the token ID into the form so it gets submitted to the server:

      $form.append($('<input type="hidden"name="stripeToken">').val(token));

      // Submit the form:

      $form.get(0).submit();

    }

  };


  function submitTwoForms() {

    var dataObject = {invoice: "invoice", name: "name", phone: "phone", email: "email", message: "message"};

      $.ajax({

        url  : base.url + '/index.php/contact',

        data : dataObject,

        type : "GET",

        success: $(function(){

              var $form = $('#payment-form');

              $form.submit(function(event) {

              // Disable the submit button to prevent repeated clicks:

              $form.find('.submit').prop('disabled', true);


              // Request a token from Stripe:

              Stripe.card.createToken($form, stripeResponseHandler);

              //to prevent submit

              return false;   

              });       

        })

      });

  }


  $('#customButton').submit(function() {

    submitTwoForms();

    return false;

  });

非常感谢任何指针。

Answer 1

我最终重新编写了我的代码，现在它正在运行。

<script>

 $("#customButton").on('click', function() {

  $('#contactForm')[0].submit(function(event){

    var formData = {

      'invoice'   :$('input[name=invoice]').val(),

      'name'      :$('input[name=name]').val(),

      'email'     :$('input[name=email]').val(),

      'phone'     :$('input[name=phone]').val(),

      'message'   :$('input[name=message]').val(),

    };


    $.ajax({

        type     : 'POST',

        url      : base.url + '/index.php/contact',

        data     : formData,

        dataType : 'json',

        encode   : true

    })

  });

})  

  function stripeResponseHandler(status, response) {

    // Grab the form:

    var $form = $('#payment-form');

    if (response.error) { // Problem!

      // Show the errors on the form:

      $form.find('.payment-errors').text(response.error.message);

      $form.find('.submit').prop('disabled', false); // Re-enable submission



    } else { // Token was created!

      // Get the token ID:

      var token = response.id;

      // Insert the token ID into the form so it gets submitted to the server:

      $form.append($('<input type="hidden" name="stripeToken">').val(token));

      // Submit the form:

      $form.get(0).submit();

    }

  };

  $(function() {

    var $form = $('#payment-form');

    $form.submit(function(event) {

      // Disable the submit button to prevent repeated clicks:

      $form.find('.submit').prop('disabled', true);

      // Request a token from Stripe:

      Stripe.card.createToken($form, stripeResponseHandler);

      // Prevent the form from being submitted:

      return false;

    });

  })

</script>

希望别人可以受益。

AJAX请求与条带相结合

1 个答案: