Включить, чтобы отправить форму после того, как пост() в JQuery

Question

У меня есть хитрая проблема с 1 недели ...

На странице у меня есть простая форма, как это:

<form action="another-page.php" method="post" target="_blank" id="buyCredit"> 
    <button id="sendPayment">Access to this page</button> 
</form> 

По щелчку на кнопку (ведьма имеет идентификатор sendPayment), у меня есть этот код:

$('#sendPayment').click(function(event) { 
    event.preventDefault(); 
    $(buyCredit()).done(function(r_buyCredit){ 
     var json = $(r_buyCredit); 
     if(json.type=="success") { 
      alert('Success'); 
      $('form#buyCredit').submit(); 
     } 
     else { 
      alert('Error'); 
      alert(json.mess); 
     } 
    }); 

    function buyCredit() { 
     $("#loader").toggleClass("hide show"); 
     return $.post("/assets/php/ajax/dashboard_buyCredit.php", "json"); 
    } 
}); 

у меня проблема:

1. Я могу видеть с помощью моих инструментов dev, запросов ajax. Они хороши.
2. Я могу видеть мой alert('Success'). Так он вступил в if().

НО одна вещь не работает: форма не представляется. Как если бы он был заблокирован другой вещи ...

Странная вещь ..

Если удалить эту строку, это работает.

return $.post("/assets/php/ajax/dashboard_buyCredit.php", "json"); 

Хоппинг вы мне поможете!

Вот тест звено этой страницы: http://goo.gl/Jn4o6y

Спасибо.

Answer 1

Вам не нужна функция buyCredit(). Также не рекомендуется использовать функции, такие как идентификаторы элементов. Также ...

• Вы, кажется, хотите отправить свои данные через Ajax, а не через традиционную передачу формы (т. Е. Тот, который перезагружает страницу). Но ваш POST-вызов не передает никаких данных. Вы можете использовать .serialize(), чтобы превратить форму в строку, которую вы можете публиковать.
• Вы должны прослушать событие submit на форме вместо click на кнопку отправки. Существуют и другие способы отправки формы (например, нажатие Enter). Вы тоже хотите их поймать.
• Использование event.preventDefault() в обработчике отправки отправки предотвращает передачу традиционной формы.
• jQuery декодирует ответ для вас. Вы можете использовать его напрямую, обернуть его в $() не полезно.
• Вы можете использовать обратный вызов .always() вызова Ajax, чтобы надежно отключить загрузку.

Модифицированный код:

$('form#buyCredit').submit(function(event) { 
    var formdata = $(this).serialize(); 

    event.preventDefault(); 

    $("#loader").removeClass("hide").addClass("show"); 

    $.post("/assets/php/ajax/dashboard_buyCredit.php", formdata) 
    .done(function (result){ 
     if (result.type === "success") { 
      console.log('Success'); 
     } else { 
      console.log('Error', result.mess); 
     } 
    }) 
    .fail(function (jqxhr, status, statustext) { 
     // an HTTP error has occurred, react to it 
    }) 
    .always(function() { 
     $("#loader").removeClass("show").addClass("hide"); 
    }); 
});