フォームをJavaScriptを使用して送信した後にボタンを有効にする方法

Question

フォームが送信されたら、ボタンを有効にしようとしています。 ボタンを有効にできますが、フォームがプロセスを完了してからボタンを有効にするまで待つ必要があります。私はsetTimeout()を使用して数秒待つことができますし、ボタンを有効にしますが、私はそれを望んでいません。フォームが処理を完了したら、ボタンを有効にしておきたい。これが可能なユースケースかどうかはわかりません。

フォーム：

<input type=submit id="myButton" class="esignReports" value="Export E-Sign Information" onclick="disableReportButton(), enableReportButton()"/> 

JS：

function disableReportButton() { 
    document.getElementById('viewIntegrationReport').submit(); 
    document.getElementById('myButton').disabled = true; 
    document.getElementById('myButton').value = 'Please wait'; 
} 

function enableReportButton() { 
    document.getElementById('myButton').disabled = false; 
    document.getElementById('myButton').value = 'Export E-Sign Information'; 
} 

感謝。

Answer 1

例えば、AJAXを経由して提出し、その後、イベントを提出

$(document).ready(function() { 
    document.getElementById('myButton').hide(); 
    function enableReportButton(callback) { 
     $("form").on("submit", function(e){ 
      e.preventDefault(); 
      callback(); 
     }); 
    } 

    enableReportButton(function() { 
     document.getElementById('myButton').show(); 
    }); 
} 

Answer 2

防ぎフォーム（スクリプトファイル）をapp.jsでこれを試してみてください。 jQuery $ .postを使用します。

$("form").on("submit", function(e){ 
    e.preventDefault(); 
    $.post(/* your data here */) 
     .done(function(){ 
      // do stuff after post 
      disableReportButton(); 
      enableReportButton(); 
     }; 
}); 

例$アヤックスで、成功を使用して：あなたの関数を呼び出すための.done（または$のアヤックスでの成功ハンドラ）を使用しSubmit form via AJAX in jQuery