Building an AJAX-driven Web page using jquery and PHP

Most PHP developers are learning skills in an old-fashioned way. They usually learn how to define and build simple PHP pages, and then learn how to connect these pages to a simple MySQL table, so you can develop your own. As the skill level increases, they learn how to create more complex PHP features and how to connect to the tables in MySQL and perform other advanced tasks.

In the process, they may also have some client-side skills to put the WEB application into use. It's also possible to learn about XHTML or CSS or even some JavaScript programming. As the variety of projects involved increases, they even have access to Ajax to give your Web application a sense of Web 2.0 or "desktop." However, if your first experience with Ajax is similar to mine, you may have done too much work-manually implementing various functions and experiencing the difficult process of creating an AJAX-driven page.

For some people, Ajax remains a mystery. It seems to be what cool kid and bad kids do in the WEB development/interaction community, and they don't have the time and patience or the ability to understand and use it. This is a shame, because many customers do like to add Ajax-style features-it makes WEB applications easier to use. If you are one of these PHP developers, do not be afraid: After reading this article, you have enough knowledge to make you a real Ajax professional.

This article shows you how to use JQuery to easily add Ajax functionality to your PHP WEB application. We'll build a simple Web application using PHP and MySQL-a phone book that contains names and phone numbers. This application has all the expected standard features-such as the ability to find names or phone numbers, MySQL tables, and so on. Next, you will add jQuery to your application so that you can find the name and phone number in real time as you type. Once you've done this, you'll have plenty of basic knowledge about jQuery and Ajax.

What is Ajax?

The best way to describe Ajax is to compare it with the traditional approach. Most Web pages and applications work in synchronous mode. When you click a link or the Submit button for a form, the request is sent to the server, which then processes the request and sends back a response. The best way to summarize this model is to "click, wait, view." This is a never-ending process of rinsing-and-repeating (rinse-and-repeat) that you are familiar with. In other words, if the page needs to display the updated information frequently, it must be put on a sort of automatic refresh hack, or let the user refresh or click a link to perform the refresh.

Ajax has changed all this. The first letter A in Ajax represents Asynchrony. Ajax allows you to create a page in any programming language, and then refresh the different parts of the page with information from a database or other backend server procedure. For example, if you have an E-commerce site that shows the products you sell. On each product page, there are several common items: Title, sales description, thumbnail image, inventory quantity.

If you want visitors to the site to be able to get the latest information on the inventory quantity. You can add an Ajax function that runs a separate PHP page that contains a MySQL query, and then populates the information on the original page without user input, and does not have to take into account the click-Wait-view mode synchronization of the event.

The J in Ajax represents JavaScript, which is the driving force of all behaviors. This is both good and bad-the good side is that it is portable and does not affect the server because it is client-side code; The downside for PHP developers is that it's completely different from the environment they're used to. This requires tools and frameworks like JQuery to dramatically simplify the way you interact with Ajax and speed up the progress of your code.