PatrickMD.net

An Ajax application is great because it allows you to build web applications that respond quickly to users. Ajax is tremendously intimidating because there are so many moving parts that must be understood. The Ajax name alone is all buzzwords: “Asynchronous Javascript and XML”. In this series of posts I will use my physician license search app to explain how to convert an old-fashioned search application into an Ajax-powered search.

The most difficult part is knowing where to start. I build from the data out to the presentation. In our case, the data is coming from the License Search page at the New York State server. We need a way to translate the search results into a format that can be presented by the Javascript on our webpage.

Ajax pages retrieve data through HTTP requests initiated by our Javascript code with the XMLHttpRequest method. Despite the name of the method, the content returned by the HTTP request does not have to be XML, but can be any string. An efficient and easy way to return structured data to a waiting Javascript instance is the Javascript Object Notation, or JSON. JSON can represent ordered sets, numbers, and strings. We will use JSON to encapsulate the physician name and license data that our “fetch” method will return.

The URL we want our page to fetch results from is “/license/fetch/”. Within the Zend Framework model, that URL will be handled by the Fetch action of the LicenseController. We will need two parameters; the name query, and a number corresponding to the profession we are searching. So the request we want looks like: /license/fetch/?name=John&profId=60.

The response we want is a list of names and license numbers in JSON format. It may look like: (the “…” indicates records removed for brevity, and the data is fictitious.)

{
    "recordsReturned":16,
    "startIndex":0,
    "records":[
    { "profId":"60",
      "licenseId":"992523",
      "name":"JOHN ACE",
      "location":"NEW YORK, NY"
    },
...
    { "profId":"60",
      "licenseId":"990975",
      "name":"JOHN MAXWELL GREER",
      "location":"NEW YORK, NY"
    }
    ]
}

Now we have a plan; take the above request and provide the above response. In the next post I will describe how we do this with PHP and Zend Framework.

Tags:   ajax · json · license searchNo Comments