Предотвращение представления MVC

Question

Я пытаюсь интегрировать платеж api в мое приложение MVC 5 asp.net C#.

1-я часть предполагает получение «токена» из этого апи без отправки моей формы.

Я относительно новичок в mvc, и я не могу заставить это работать.

Эта часть моей разметки:

@using (Html.BeginForm("NewCard", "Payments", FormMethod.Post, new { enctype = "multipart/form-data" })) 
{ 
<form action="" method="POST" id="payment-form"> 
    <span class="payment-errors"></span> 

    <div class="form-row"> 
     <label> 
      <span>Card Number</span> 
      <input type="text" size="20" data-stripe="number" value="4242424242424242"/> 
     </label> 
    </div> 

    <div class="form-row"> 
     <label> 
      <span>CVC</span> 
      <input type="text" size="4" data-stripe="cvc" value="1223"/> 
     </label> 
    </div> 

    <div class="form-row"> 
     <label> 
      <span>Expiration (MM/YYYY)</span> 
      <input type="text" size="2" data-stripe="exp-month" value="10" /> 
     </label> 
     <span>/</span> 
     <input type="text" size="4" data-stripe="exp-year" value="2022"/> 
    </div> 

    <button type="submit">Submit Payment</button> 
</form> 
} 

$('#payment-form').submit(function (event) { 
    var $form = $(this); 

    // Disable the submit button to prevent repeated clicks 
    $form.find('button').prop('disabled', true); 

    Stripe.card.createToken($form, stripeResponseHandler); 
    // Prevent the form from submitting with the default action 
    event.preventDefault();   //i added this is! 
    return false; //from the sample code! 
}); 

форма по-прежнему представляет/сообщений назад.

Что я делаю неправильно?

Answer 1

У вас есть недопустимый html (вложенный <form> элементов) и подана внешняя форма. Снимите внутреннюю

<form action="" method="POST" id="payment-form"> 

тег, и если вы хотите обратиться к id (вы могли бы просто использовать $('form').submit(function (event) {), то изменить внешний вид на

@using (Html.BeginForm("NewCard", "Payments", FormMethod.Post, new { id = "payment-form", enctype = "multipart/form-data" }))