Java Reference
In-Depth Information
The form you build resembles typical forms used today; it will contain the following fields:
➤
Username
(validated):
The field where the user types his or her desired username
➤
Email (validated):
The field where the user types his or her e‐mail
➤
Password (not validated):
The field where the user types his or her password
➤
Verify Password (not validated):
The field where the user verifies his or her password
Note that the Password and Verify Password fields are just for show in this example. Verifying a
password is certainly something the server application can do; however, it is far more efficient to let
JavaScript perform that verification. Doing so adds more complexity to this example, and we want
to keep this as simple as possible to help you get a grasp of using Ajax.
Next to the Username and Email fields will be a hyperlink that calls a JavaScript function to query
the server with your
HttpRequest
module from the previous section.
As mentioned earlier, Ajax is communication between the browser and server. So this example needs
a simple server application to validate the form fields. PHP programming is beyond the scope of this
book. However, we should discuss how to request data from the PHP application, as well as look at
the response the application sends back to JavaScript.
requesting information
The PHP application looks for one of two arguments in the query string:
username
and
email
.
To check the availability of a username, use the
username
argument. The URL to do this looks like
the following:
http://localhost/formvalidator.php?username=[
usernameToSearchFor]
When searching for a username, replace
[usernameToSearchFor]
with the actual name.
Searching for an e‐mail follows the same pattern. The e‐mail URL looks like this, where you replace
[emailToSearchFor]
with the actual name:
http://localhost/formvalidator.php?email=[
emailToSearchFor]
the received data
A successful request results in a simple JSON structure that defines two members called
searchTerm
and
available
, like this:
{
"searchTerm": "jmcpeak",
"available" : true
}
As its name implies, the
searchTerm
item contains the string used in the username or e‐mail search.
The
available
item is a boolean value. If
true
, the requested username and/or e‐mail is available
for use. If
false
, the username and/or e‐mail is in use and therefore not available.