Dealing with Very Large Select Lists (drop down menus)
-
Hi Guys, I have a PHP script that grabs customer names (about 30,000+) from a MySQL Database, and using PHP outputs to the client browser. From this list then can select which customer they will insert, or update, a record for. Once the page is loaded, I use an onChange event (using AJAX) attached to the select list to populate part of the page with with customer information. There are basically two pages that use this. On the INSERT page, where new SALE record is created, and the UPDATE page, where a sale may be edited. Obviously the end user needs to be able to select ANY of the customers stored, and the assumption that they may know the spelling, or part thereof, of a customer cannot be made... otherwise a nice search and select function would be great! It is obviously bad practice to load so many customers in at once, So I am looking for suggestions or solutions. One idea i had was to load only the customer for which the sale is to be edited, and then when they click on it, load the rest, but that still sucks. maybe a search function is the best way, just wish users were not so incompetent :P cheers for any ideas guys, mick
-
Hi Guys, I have a PHP script that grabs customer names (about 30,000+) from a MySQL Database, and using PHP outputs to the client browser. From this list then can select which customer they will insert, or update, a record for. Once the page is loaded, I use an onChange event (using AJAX) attached to the select list to populate part of the page with with customer information. There are basically two pages that use this. On the INSERT page, where new SALE record is created, and the UPDATE page, where a sale may be edited. Obviously the end user needs to be able to select ANY of the customers stored, and the assumption that they may know the spelling, or part thereof, of a customer cannot be made... otherwise a nice search and select function would be great! It is obviously bad practice to load so many customers in at once, So I am looking for suggestions or solutions. One idea i had was to load only the customer for which the sale is to be edited, and then when they click on it, load the rest, but that still sucks. maybe a search function is the best way, just wish users were not so incompetent :P cheers for any ideas guys, mick
Breaking the data down into sub-categories, such as all customers with surnames beginning with A, for example, followed by all of these customers with first names beginning with A, or that live in a particular region; I assume this would cut the number of records being fetched down drastically? Regards, --Perspx
"The Blue Screen of Death, also known as The Blue Screen of Doom, the "Blue Screen of Fun", "Phatul Exception: The WRECKening" and "Windows Vista", is a multi award-winning game first developed in 1995 by Microsoft" - Uncyclopedia
-
Hi Guys, I have a PHP script that grabs customer names (about 30,000+) from a MySQL Database, and using PHP outputs to the client browser. From this list then can select which customer they will insert, or update, a record for. Once the page is loaded, I use an onChange event (using AJAX) attached to the select list to populate part of the page with with customer information. There are basically two pages that use this. On the INSERT page, where new SALE record is created, and the UPDATE page, where a sale may be edited. Obviously the end user needs to be able to select ANY of the customers stored, and the assumption that they may know the spelling, or part thereof, of a customer cannot be made... otherwise a nice search and select function would be great! It is obviously bad practice to load so many customers in at once, So I am looking for suggestions or solutions. One idea i had was to load only the customer for which the sale is to be edited, and then when they click on it, load the rest, but that still sucks. maybe a search function is the best way, just wish users were not so incompetent :P cheers for any ideas guys, mick
Usually when I have that many records I opt for a paginated list and not rely on comboboxes or One option I can think of is using AJAX to dynamically update the combobox as selectedIndex reaches the last element -- insert 500 more. However this still has the problem that if the user scrolls without using keyboard selectedIndex doesn't change so you would need to capture the scroll position as well and I'm not sure that is possible inside a drop down or native HTML control. Lastly using AJAX like this would destroy any chance of accessibility you might have. If someone disabled JavaScript they'd never be able to use your application. I would go for either two or more combobox'es and categorize them or use a paginated list. I'm finding the only constant in software development is change it self.
-
Usually when I have that many records I opt for a paginated list and not rely on comboboxes or One option I can think of is using AJAX to dynamically update the combobox as selectedIndex reaches the last element -- insert 500 more. However this still has the problem that if the user scrolls without using keyboard selectedIndex doesn't change so you would need to capture the scroll position as well and I'm not sure that is possible inside a drop down or native HTML control. Lastly using AJAX like this would destroy any chance of accessibility you might have. If someone disabled JavaScript they'd never be able to use your application. I would go for either two or more combobox'es and categorize them or use a paginated list. I'm finding the only constant in software development is change it self.
Hi guys, Thanks for your interesting replies. Hockey, I had a similar idea with the automatic update, its a great idea, and accessability doesnt matter, since this is an internal intranet style project, and they won't need to implement accessability standards (until the next programmer is hired, lol! poor bastard) In regards to the Javascript being disabled, the way the program works now, almost every page relies on Javascript being enabled. Every avenue with this project has been against any standards, and most coders would have a hemorage if they saw the source code! :/ The users will ALWAYS use the mouse to select from the drop down menu, and it already has an ajax onChange event attached, so I will have to read up about this selectedIndex and how to implement it. I believe this is probably the correct way to go though. Once again, thanks very much for your help guys, Mick