title: Collect form data for ajax submission
body: <p>I have a database which has over 50 items in it which need to be checked and possibly edited. I have a web page which pulls the data from the database using php and displays it as values in a webform. Then I have a series of submit buttons at the bottom of the page, depending on what the user wants to do. Each button uses an onclick method to call a javascript function.</p>
  
  <p>In the case where some changes need to be made, the user will make edits directly in the webform. For example, in a textarea, the value of the textarea will display the current content of the database item. The user can then edit the content. Clicking a "Save Changes" button calls an ajax function to send the data back to the server using a POST request. </p>
  
  <p>The problem I am having, probably simple to someone who knows how, is how to collect all the updated data from the different form components to send to the server in the variable "FormData" below (presumably an array). Is there a way to do this all at once, or do I have to step through every one of the form elements and add them to the array one by one? "msg" refers to a <code>&lt;div id="msg"&gt;&lt;/div&gt;</code> where a message from the server page will be displayed.</p>
  
  <p>My ajax function so far is:</p>
  
  <pre><code>function callsave() {
      var xmlHttp, FormData;
      xmlHttp = new XMLHttpRequest;
      xmlHttp.onreadystatechange = function () {
          if (xmlHttp.readyState == 4 &amp;&amp; xmlHttp.status == 200) {
              document.getElementById("msg").innerHTML = xmlHttp.responseText;
          }
      }
      xmlHttp.open("POST", "savechanges.php", true);
      xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
      xmlHttp.send(FormData);
  }
  </code></pre>
  
  <p>The submit button at the end of the form is:</p>
  
  <pre><code>&lt;input type="button" value="Save Changes" id="save" onClick="callsave();"&gt;
  </code></pre>
  
  <p>Many thanks for pointing me in the right direction.  BTW, this is my first ajax coding.</p>