title: Send Custom HTTP Body with AJAX POST request
body: <p>How do I send a custom HTTP body with my POST AJAX request in plain Javascript (not JQuery)? I am actually trying to send a JSON file in the body. I can set the custom header fields but can't find how to set HTTP body.</p>
  
  <p>below is the code</p>
  
  <pre><code>function calculateorder() {
  
      document.getElementById("finalize").style.display = "inline";
  
      url1 = "https://ethor-prod.apigee.net/v1/stores/";    
      url2 = "/orders/calculate?apikey=wSgbv9PE8aJhDOI17vvTUX1NlAceUXG7";
  
      url = url1 + store_id + url2;
  
      var xmlhttp;
      xmlhttp = new XMLHttpRequest();
  
      xmlhttp.onreadystatechange = function() {
          if (xmlhttp.readyState == 4 &amp;&amp; xmlhttp.status == 200) {
              alert(xmlhttp.responseText);
          }
      }
  
      xmlhttp.open("POST", url, true);
      xmlhttp.setRequestHeader("Content-Type", "application/json");
      xmlhttp.send(JSON.stringify(calculate));
  }
  </code></pre>
  
  <p>When I used the same headers and JSON file with Rested (a OSX HTTP client) It works perfectly</p>