AJAX, PHP, XML, and cascading drop-down lists

Question

What PHP libraries would you recommend to implement the following:

• Three dependent drop-down lists
• Three XML data sources
• AJAX-based

Essentially, I'd like to create an XML database and wire up a form that allows the user to select three different dependent parameters:

1. User clicks Region
2. User clicks District (filtered by Region)
3. User clicks Station (filtered by District)

Even though I would like to use PHP and XML, the general problem is:

• One XHTML form
• Three dependent, cascading drop-down lists
• Three flat files (no relational database) for the list data

The solution must be efficient, simple, reliable, and cross-browser.

What technologies would you recommend to solve the problem?

Thank you!

Answer 1

Vanilla php and a good JavaScript framework is all you'd need.

You'll need to build a php script to generate filtered lists of districts and stations based on the provided parent filter (pushing out the data as either xml or json). The php will need to parse the xml data and filter the list based on criteria (obviously a db will handle this better than manually parsing xml)

Then use a js framework to query the php files every time the parent list's value changes. A js framework isn't required (and actually cause some bloat), however it'll make developing the app an easy task.

Personally I'd recommend jQuery due to the easy learning curve, but any popular js framework will yield the same result.

Answer 2

I'd say jQuery and the Autocomplete plugin.

• make three conventional text boxes and enhance them with autocomplete()
• each one requests data from the server as the user types, via AJAX GET requests
• the server sends back the matching data as line-based text, which in turn the autocomplete plugin uses to display a list of options
• hook up an handler for the result event of the dropdowns, storing the selected option.
• the second textbox would require the first to be set and so on
• each textbox requests data from the server including all previously selected options so the server can find the right data
• the server works with DOMDocument and DOMXPath to get the data, the autocomplete plugin has built-in client side caching do ease load on the server