An Introduction to Ajax (with JSON) - JavaScript by Example - page 805

When the first parameter to the Ajax open() method is GET, the second argument is
the URL of the page that is being requested. If the URL is a server-side script, such as
PHP or ASP.NET, any input data (name/value pairs), is sent as a URL-encoded query
string. A question mark, followed by the query string, is appended to the URL. As you
might remember in traditional form processing, if the GET method is used, the data will
be attached to the URL in the location box of the browser, visible to all. With Ajax the
URL is an argument to the open() method and is not visible in the browser window
because it is being sent directly from Ajax to the server. For the GET method:

EXAMPLE (S AMPLE C ODE )

ajaxRequestObject.open(" GET ","http://localhost/ajaxform.php ?username="+
namevalue+"&userphone="+phonevalue , true);
ajaxRequestObject.send(null);

With the POST method, additional data is sent to the server. The first argument to
the open() method will be POST, the second argument, the URL of the server script, and
the third true for asynchronous. Instead of attaching the query string to the URL it will
be sent as an argument to the send() method.
The setRequestHeader() method is added to specify the Content-type, set to “appli-
cation/x-www-form-urlencoded”. This is needed for any POST request made via Ajax.
Finally, the send() method is called, passing in the parameters that will be sent to the
server-side program (without the “?” prefix). This data is formatted as a query string
(e.g., “name=value&foo=bar”), and not visible in the browser.

EXAMPLE (S AMPLE C ODE )

ajaxRequestObject.open(" POST ", "http://localhost/ajaxform.php", true);
ajaxRequestObject.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
ajaxRequestObject.send(username=”+namevalue+”&userphone=”+phonevalue,
true);

18.3.3 Sending the Request to the Server

Once the object has been initialized, the browser can send a request to the server with
the send() method. This method takes one argument of “null” if you use the GET
method for sending the data. As discussed in the previous section, with the POST
method, an additional step is required. The setRequestHeader() method tells the server
the “Content-type”, and the send() method sends the query string as name/value pairs
to the server.