Adding Ajax

Processing the Ajax Response

To process the Ajax response and display the recipe, we must make two changes in our existing application. The first is embedding the request response directly in the page and the second is modifying the page layout to provide a place for the response.

In the last example in the previous section, the getRecipe function makes its request to the same drink.php web application used with the earlier, traditional web application, and the existing server-side application is designed to create a web page rather than to return data. This functionality is apparent when reviewing the data returned in the XHR object's responseText property. Both the page formatting and the data are returned, but an Ajax application needs only the data.

We must therefore change the server program from a web application to a web service that will support machine-to-machine interaction over a network. Specifically, we want the web service to return the data using a predetermined web service protocol (in this case, REST), rather than the simpler approach of setting application variables. Since the same functionality still has to be available to the nonscripted application, whatever approach we use must work whether the application is used within a traditional web application or invoked as a web service.

For our purposes, the change is simple: add echo $result at the end of the recipe.php application to print the result out. With this one small change, the application works whether embedded ...