Book Image

AJAX and PHP: Building Responsive Web Applications

By : Mihai Bucica, Cristian Darie, Bogdan Brinzarea, Filip Chereches-Tosa, Philippe Wauthier
Book Image

AJAX and PHP: Building Responsive Web Applications

By: Mihai Bucica, Cristian Darie, Bogdan Brinzarea, Filip Chereches-Tosa, Philippe Wauthier

Overview of this book

Assuming a basic knowledge of PHP, XML, JavaScript and MySQL, this book will help you understand how the heart of AJAX beats and how the constituent technologies work together. After teaching the foundations, the book will walk you through numerous real-world case studies covering tasks you'll be likely to need for your own applications: Server-enabled form-validation page Online chat collaboration tool Customized type-ahead text entry solution Real-time charting using SVG Database-enabled, editable and customizable data grid RSS aggregator application A server-managed sortable list with drag&drop support using the JavaScript toolkit The appendices guide you through installing your working environment, using powerful tools that enable debugging, improving, and profiling your code, working with XSLT and XPath. From the Author, Cristian Darie AJAX and PHP: Building Responsive Web Applications is mainly a book for beginners, but when designing its contents we tried to find the ideal blend of topics that would help both novice and experienced web developers make a big step forward. One customer was very kind to let us know, through a review, that we succeeded: "The theory behind all the technologies used is very clearly explained, without boring you with details about obvious things. Right from the first chapter you start learning by examples. The examples can be easily adapted to many web projects and they cover stuff that is both useful and fun." Here are a few examples of such "useful and fun" things that you can find in this book: details on using proxy scripts to work around the security measures in modern browsers client-side and server-side code that doesn't break when fed with special characters (such as <, ", etc) code that works efficiently with Internet Explorer 5, 6 and 7, Firefox, Opera, Safari, and others a very quick introduction to SVG, the new rebel kid of the web (and of the house) client-server communication based on message queues that guarantee that your messages aren't lost on the way, and arrive in the intended order at the destination server-side state management techniques that use query string parameters and database records to keep track of your client's activity simple yet effective error-handling structures that combine JavaScript code and PHP code to report when something bad happens on the client or on the server a live errata page that is updated as soon as anyone reports a suggestion or a correction a friendly AJAX tutorial and many case studies that teach you how to use JavaScript, PHP, MySQL and XML together in order to achieve wonderful results The book's authors and the publisher are listening to your feedback, and appreciate when you invest some time to let them know what you think. The first result of this collaboration is an updated version of the AJAX Chat case study that uses (and teaches) JSON instead of XML. Find this new chapter in the code download or on my website. Thanks for reading such a long message. Have fun!" Cristian Darie.
Table of Contents (17 chapters)
About the Authors
About the Reviewers

Preparing Your Windows Playground

Here we cover installing these software products in your Windows machine:

  • Apache 2

  • PHP 5

  • MySQL 5

Installing Apache

You can download the latest MSI Installer version of the Apache HTTP Server from Download the latest Win32 Binary (MSI Installer), which should have a name like apache_2.x.y-win32-x86-no_ssl.msi, then execute it.

The default installation location of Apache 2 is C:\Program Files\Apache Group\Apache2\, but the installer allows you to specify a different path. You can choose a more convenient location (such as C:\Apache), which can make your life working with Apache easier.

During installation you’ll be asked to enter your server’s information:

Figure A.1: Installing Apache 2.0

If you’re not sure about how to complete the form, just type localhost for the first two fields, and write your email address for the last. You can change this information later by editing the Apache configuration file. The default location of this file is C:\Program Files\Apache Group\Apache2\conf\httpd.conf.

You can also choose to install Apache on Port 80, or on Port 8080. The default port is 80, but if you already have a web server (such as IIS) on your machine, you’ll need to install Apache on a different port. If you choose to run Apache on Port 8080, you will need to start the Apache service manually by going to the Apache bin folder (by default C:\Program Files\Apache Group\Apache2\bin), and typing

apache -k install

When the web server runs on a port different than 80, you need to specify the port manually when making HTTP requests, such as in http://localhost:8080/ajax/suggest.

In the next setup screens, you can safely use the default options.

Along with the Apache server the installer will also start the Apache Service Monitor program, which is available from the taskbar. The taskbar icon reflects the current state of the web server (stopped, running, etc.), and also allows you to start, stop, or restart the Apache service.


Keep in mind that you’ll need to restart (or stop and then start) the Apache service after making any changes to the httpd.conf configuration file, in order for the changes to become effective.

After installing Apache 2, make sure it works OK. If you installed it on port 80, browse to http://localhost/. If you installed it on 8080, go to http://localhost:8080/. You should see an Apache welcome message similar to this:

Figure A.2: Apache Installed Successfully

Installing MySQL

The official website of MySQL is At the time of this writing the latest stable version is MySQL 5.0, and you can download it from However, it’s good to know that we made our SQL queries compliant with the SQL 92 standard, so you should be able to reuse them with other database systems with minimum of translation effort.

In the Downloads page, scroll down to the Windows downloads section, and download the Windows Essentials file. You’ll be asked to choose a mirror site, and the file will be named something like mysql-essential-5.0.xx-win32.msi. After downloading the file, simply execute it to install your MySQL Server.

After installation you’ll be given the chance to configure your server. Do so. It’s safe to use the default options all the way through. At some point you’ll need to set the root password, which will correspond to the root@localhost user. Choose a password that’s complicated enough for others not to guess and simple enough for you to remember.

Before going through any case studies in this book, remember to see the Preparing the AJAX Database section at the end of this appendix.

Installing PHP

The official website of PHP is Start by downloading from the Windows Binaries section the latest PHP 5 zip package (not the installer!) from We prefer not to use the installer because it doesn’t include extensions that you may need for your projects, and it doesn’t do much configuration work for you anyway.

After you download the Windows binaries, follow these steps to install PHP:

  1. Unzip the zip package (it should be a file with a name like into a folder named C:\PHP\. You can choose another name or location for this folder if you want.

  2. Copy php.ini-recommended from C:\PHP\ to your Windows folder (C:\Windows), renaming it as php.ini.

  3. Open php.ini for editing with the text editor of your choice (such as Notepad) and uncomment the php_gd2.dll, php_mysql.dll, and php_xsl.dll extension lines (by removing the leading semicolons), and add a similar line for php_mysqli:

  4. We recommend enabling full error reporting for PHP on the development machine, but this is optional (this option is the default). Be warned that this change can alter the functionality of other scripts on your server. Find the error_reporting line in php.ini and change it to:

    error_reporting = E_ALL
  5. Copy php5ts.dll and libmysql.dll located in C:\PHP\, to the Windows System32 folder (by default \Windows\System32).

  6. Copy php_mysql.dll, php_mysqli.dll, php_xsl.dll, and php_gd2.dll from C:\PHP\ext, to the Windows System32 folder.

  7. Open the Apache configuration file for editing. By default, the location of this file is C:\Program Files\Apache Group\Apache2\conf\httpd.conf.

  8. In httpd.conf, find the portion with many LoadModule entries, and add the following lines:

    LoadModule php5_module c:/php/php5apache2.dll
    AddType application/x-httpd-php .php
  9. Also in httpd.conf, find the DirectoryIndex entry, and add index.php at the end of the line, like this:

    DirectoryIndex index.html index.html.var index.php
  10. Save the httpd.conf file, and then restart the Apache 2 service, using the Apache Service Monitor by clicking its icon in the Notification Area of the taskbar. (If you get any error at this point, make sure that you followed correctly all the previous steps of the exercise.) If Apache restarts without generating any errors, that is a good sign.

  11. Create a folder called ajax under the htdocs folder (by default C:\Program Files\Apache Group\Apache2\htdocs).

  12. To make sure that your Apache instance can also correctly parse PHP code, create a file named test.php in the ajax folder, and then add the following code to it:

  13. Point your web browser to http://localhost/ajax/test.php (or http://localhost:8080/ajax/test.php if you installed Apache to work on port 8080) to test if everything went OK with the installation. You should get a page like this:

    Figure A.3: PHP Installation Working

Congratulations, you just finished installing Apache, MySQL, and PHP!

The configuration set up isn’t yet finished. If you’re running Windows (and you probably are, since you’re reading this), please skip the Preparing Your *nix Playground section, and go through the Installing phpMyAdmin and Preparing the AJAX Database sections at the end of this appendix.