PHPBuilder - Remote Scripting with Javascript, IFrames and PHP Page 2

RSS Twitter

Remote Scripting with Javascript, IFrames and PHP - Page 2

by: David Vance
May 10, 2004

The Project

Specifically, what needed to get working was a project at my work that involved porting a desktop application created in Microsoft Access to a web-based PHP/MySql intranet application. Among the directives from management was to make the web application look and behave as much like the existing Access application as possible. And one of the many small features of this application which didn't map precisely to the web platform was a self-populating drop down search field. You've certainly seen these in various applications: the user begins to type in a text box, and as they do, the drop down box is populated with a list (usually alphabetically ordered), starting with the string that is being typed. As each letter is typed, the list changes and (usually) becomes more narrowly focused.

To recreate this in a web page I had several options. First, I could build the Select element server side with PHP, populating the Option elements from the database, and send the page with the pre-populated list. I could then tie into that option list with some Javascript that searched the list and selected the appropriate option based on the string typed into the text box. Fairly straightforward, except that the option list I needed to create had more than 60,000 records and was growing by a couple thousand every month. In fact, a previous developer had prototyped this method in ASP. The resulting page sent to the browser, with it's 60,000 option-long Select list, was nearly 4 MB. And the Javascript that searched the list with each "onkeyup" in the textbox was extremely slow, about 5-10 seconds between each keypress, or 30-seconds to type "Smi" and point to the "Smith" records.

Perhaps the Javascript could have been optimized somewhat, but to have a 4 MB page being requested concurrently, and often, by 10-plus users obviously wouldn't work. So a second option I had was to omit the Select list and just make the textbox a standard search field. Type in "Smi", hit enter, and get back a list of all the "Smi*" records. A reasonable approach, but I felt it didn't meet the "emulate Access" directive closely enough.

So finally, to the subject of the article. I thought, if I could talk to the server from the client, somehow without reloading the current page, I could "fake" the dynamic drop down list. Searching the net, I found several Remote Scripting options: several Java applets, a very nice and well-used Javascript library from Brent Ashley, and other methods. But I settled on the Iframe approach referenced at the beginning of this article for it's simplicity and lightweight implementation.

« Previous Page
Next Page »

Comment and Contribute

Your comment has been submitted and is pending approval.

David Vance



(Maximum characters: 1200). You have characters left.