Halleynet Headspace

Archive for the ‘Webdesign’ Category

I have been working on a project recently that required me to build a multi level search feature, you know the kind of thing where on selecting the first item in a list of options, the next level becomes available.

One thing you really need to get this working is Ajax. You don’t want to be having full page reloads as each selection is made, wouldn’t it be cool to just update the next selection box?

Now no doubt there are many ways to skin a cat but to be honest

1)There are few (if any) out the box scripts on the web to do this that I could find

2) I am a great believer in not reinventing the wheel and KISS (Keep it Simple Stupid!)

3)Most purely javascript scripts I could find “cheated” in that they pulled down a predefined list of data to the browser and used client based scripts to sort and filter it. This is Ok I suppose in a static environment but its not terribly flexible for a dynamically driven site, and if you have a lot of data to be sorted, as potentially I do in my project,you are dumping the whole list for the user to ultimately choose one item. Better to send only whats needed.

For this reason, and for the reason that its handy and available in DW4 as it comes out the box, I decided to use Adobe’s Spry Javascript Framework. DW4 is a pretty expensive package but there is a free trial version for 30 days use if you want to use this, or if you are a student you can get the package (for non commercial use ) for much cheapness- relative to what it costs me!!!

There are a few frameworks out there, Spry, jQuery, Scriptaculous, prototype, but for me Spry was most accessible  as fundamentally I am a non Javascript developer and I have some experience of its use through other projects.

If you don’t have Spry now and you want to follow along, go to Adobe’s website and download the files. In DW4, it loads up the files you need as you use each function, but if you are not using DW4, feel free to dump the whole package on your server in some folder.

For this example I will use a directory called /spry but it can be anything you want.

If you are bandwidth constrained, you can get a minified version of the files too, this reduces the amount of code being sent to the browser, it does not make much odds on a quiet website, but in a busy case it might save you considerable bandwidth fees down the line.

So with the basis of this project set before you, get the bits you need here and next time I will show how I got the multi level search started.

My assumption is you know a little php to run a database query and know how to get that out the database into xml format. For this project i will be using static xml files.

I being a web developer (amongst other things!) take great care to back up my PC daily, as I have thousands of lines of code belonging to numerous websites that i need to be able to work on and update.

My workstation runs Vista Home Premium. Now really  should have Vista Business but its a long story that I am not going to go into here why I have Home premium.

I do my backups two ways, I run Sync Toy every day to an external drive and I run Windows Vista Backup to an internal drive.

Following a recent crash with my Raid array (a striped set) I went to restore my user data from a back up. I was surprised to find that none of my files with php extensions were there.

Fortunately I had the copies from by Sync Toy images so I was OK but its worth stating that unless all your interested in is the back up of “personal” files- ie images, mp3s and common file extension docs like xls or doc files you cannot rely on the back up tool for Vista to save you. Somewhat oddly it does save html files- probably due to the fact that many programs can generate html files as an output format, that are not deemed as “professional” file types.

Be warned!