Exercise Explanation

This is the PHP and AJAX grid application you create in Chapter 8 of AJAX and PHP: Building Responsive Web Applications.

Data grids have always been one of the areas where web applications have had a serious disadvantage compared to desktop programs. The fact that the page needed a full reload when switching between grid pages, or when updating grid details, harmed the application from a usability point of view. Technically, fully reloading the page has bad effects as well, unnecessarily wasting network resources.

But now you know there is a smarter solution to this problem. You can use AJAX to update the grid content without refreshing the page. You can keep your beautiful design in the client browser without even one page blink. Only the table data is refreshed, not the whole page.

In this exercise you use Extensible Stylesheet Language Transformation (XSLT) and XML Path Language (XPath) to generate the client output. XSLT and XPath are part of the Extensible Stylesheet Language (XSL) family. XSLT allows defining rules to transform an XML document to another format and XPath is a very powerful query language that allows performing searches and retrieving data from XML documents. When used to create web front ends, XSLT permits implementing a very flexible architecture, in which the server outputs the data in XML format, and that data is transformed to HTML using an XSL transformation. You can find an introduction to XSL in Appendix C (PDF document), and a good description at Wikipedia.

Note the XSL transformation can be applied at both client side and server side. The implementation in this exercise relies on client functionality to perform the transformation. This doesn't require any special features of the server, but it poses some constraints for the client. In Chapter 10 of the book, you will learn how to apply the transformation at the server side using PHP functionality, in which case you require this feature to be enabled in PHP, but the solution works with any client, as the client receives directly the HTML code it is supposed to display.

In this exercise, you use:

• XSL to generate an HTML data grid based on XML data received from the server.
• AJAX to implement the editable data grid. The user should be able to switch between product pages and edit product details without experiencing any page reloads.
• PHP to handle the grid operations at the server
• MySQL to store the grid records

The complete AJAX and PHP tutorial features even more AJAX web development examples.