Contact
Sitemap
Download
Buy online
Imprint
Home

Ajax, shorthand for Asynchronous JavaScript and XML, is a web development technique for creating interactive web applications.

The intent is to make web pages feel more responsive by exchanging small amounts of data with the server behind the scenes, so that the entire web page does not have to be reloaded each time the user makes a change.

Here is an example Ajax code in CityDesk taken from this site and which handles a user feedback (checkboxes) and sends the result to an email address. You can download the CityDesk file from here (only 26KB zipfile) and adapt it to your own needs. Note that you need a webspace with support for PHP or a local webserver installation to use this example.

When the user clicks on "Submit", an animation appears while the server is processing the send request in the background - no webpage reload occurs:

Then, a confirmation text ("Thank you!") is displayed:

The CityDesk database to achieve this has three main parts:

  • the index article which shows the form and animation
  • the javascript code to handle the Submit request
  • the PHP code to send the email

Remember: you can download the entire CityDesk database file and use it for your own needs without restrictions. Lets take a look at the HTML View of the index article:

As you can see (blue highlight), clicking on the Submit button launches a function called "sendPoll()". This is a javascript function which initiates the Ajax request which then calls the PHP server script. Hint: the animation is temporarily hidden and later, when Submit is clicked, made visible again.

Here is the sendPoll() function as part of the Javascript code.

From Javascript we then call the PHP server script (see blue highlight with magic name) to send the form data to an email address:

Substitute for your own email address, publish to your webserver and have fun with the power of Ajax.


teampublish :: we are finalizing our own "web-based version" of CityDesk to be called teampublish. Advanced Ajax technology enables us to offer a similiar user experience although teampublish is running in web browsers. Stay informed and sign-up to our CityDesk newsletter. We'll publish additional CityDesk offerings and tutorials as well as launch information about teampublish there first.

 

Copyright © 2005-2006 by telepark. All rights reserved.