script.aculo.us Ajax Auto Completion problem
 

Hi I'm currently learning myself how to use the script.aculo.us framework and i thought I'd try out a little basic script to see how the ajax functions work.

The script is querying a mysql database to get and display a list of countries and place them in an unordered list for the user to choose from and displays once he starts typing into a text box.

But im having a bit of trouble with it, when i start typing a letter say 'L' the list appears ok like below:

Latvia
Lebanon
Lesotho
Liberia
Libya
Liechtenstein
Lithuania
Luxembourg

but say if I wanted luxembourg and I typed 'Lu' the list disappears instead of displaying luxembourg! I've noticed I had to put the Mysql LIKE wildcard symbol % at the end after the variable to check, if I put it at the front before the variable it seems to spit all of them out.

secondly If I choose an option and hit enter the form submits itself, so ive put return false in the onsubmit attribute for the time being but is there another way to prevent the form submitting itself if i hit enter on that field.

And thirdly, it doesnt seem to work in firefox, its doesnt display the menu. It runs ok but kinda slow response in IE but runs fine in opera (apart from the probs above) any ideas? :confused:

here is the html page

The server side script

Well I've found out why its not working in firefox, it doesnt seem to be parsing the prototype.js file correctly. I just looked at the error console and it had heaps of errors saying ajax is not defined and missing after property id etc.

i clicked the link below the error and it opened the source on the line in question and its displaying a heap of well, gibberish!

any ideas why this is happening. :mad: