How do you sent HTTP POST method using Ajax and retrieve the input field values without Jquery or prototype?

I think I'm getting pretty close to the solution but can't really 开发者_如何学JAVAfigure out how to send HTTP POST method using Ajax. I think this will help me understand my REST project too.

There are lot of resource available online using Jquery or Prototype js framework but I want to know how without it.

 <script type="text/javascript">
        function loadXMLDoc() {
            var xmlhttp = new XMLHttpRequest();
            var out;

            xmlhttp.onreadystatechange = function() {
                if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    out = xmlhttp.responseText;
                    alert(out);
                }
            }
            xmlhttp.open("POST", "/resources/Inventory/2", true);
            xmlhttp.setRequestHeader("Content-type", "application/jason");
            xmlhttp.setRequestHeader("Connection", "close");

            xmlhttp.send(null);
        }

        </script>

When using non-ajax POST (i.e. page reload or redirect), on server side, I can get inputs value of HTML form submitted by users.

But my confusion is with Ajax HTTP POST, how do I get the values specified in input field of HTML form? Is it even possible or it is not right way of thinking?

<form method="post" action="">
   <input type="text" name="info1" />
   <button value="click to call js" onclick="loadXMLDoc()">
</form>

You need to send the POST-data in the body of the request, e.g. "field1=value1&field2=value2".

See here for more info: http://www.openjs.com/articles/ajax_xmlhttp_using_post.php

Check the content-type there!