title: Dealing with multiple AJax post failures from multiple form inputs
body: <p>I'm working on a PHP app for serving multiple choice and text-based questions.   In the Javascript code, when the user answers a question, an ajax submit submits the response to the PHP server. </p>
  
  <p>Here's how that works:</p>
  
  <pre><code>$('textarea,input').on('change',function postinput() {
    var name = $(this).attr('name');
    var value = $(this).val();
    var itemstr = name + "=" + value;
    $.ajax({
      url: window.location.href,
      data: itemstr,
      type: 'post'
    }).done(function(responseData) {
      console.log('Done: ', responseData);
    }).fail(function() {
      console.log('Failed');
    });
  });
  </code></pre>
  
  <p>At the moment, it works perfectly doing exactly what it's supposed to do. The server gets the response, and stores it in a database.  </p>
  
  <p>However, the AJax part of my solution needs to be a lot more robust. What if there is a temporary network blip when the user goes to answer a question? Or even worse, what if the network goes down for a minute or two, or even longer? Or what if the server goes down? I need to let the user know that there's a problem, and either retry automatically, or give them a button to push to retry.</p>
  
  <p>What would be the best way to handle these errors in the ajax code? The answer, of course, is to fill in the "fail" block, but I'm not exactly sure what that should look like. </p>
  
  <p>Since each form change is initiating an Ajax response, I don't want each one of them individually retrying or it could potentially load the server when it comes back up. How could the fail block keep track of these failed submits from all the submits, and retry periodically?</p>