I'm using the Textpattern CMS to build a discussion site-- I have a firm grasp of XHTML and CSS, as well as Textpattern's template language, but PHP and Javascript are a bit beyond my cunning.
On the input form to begin a new topic, users need to select a category from a list of over 5,000 options. Using the HTML select-type input element is very unwieldy, but it works. I would like to use some kind of Javascript magic to display a text-type input element that will read user input and display matches or autocomplete from the available categories, passing the required option's value into the appropriate database field.
I've seen several autocomplete plugins for jquery, but the instructions presuppose that you understand how Javascript works.
As I mentioned above, it's easy for me to generate the category list as a select-type input element, and I can hide that element using CSS. Is it possible to control select-list input using an autocomplete mechanism in a text-type input element? How would I do that?
You can set up the autocomplete to take its data from a URL, so I can see this being used in a couple nifty ways with Textpattern.
The array format that autocomplete uses looks like this:
["example_one", "example_two", ... ]
Since you have 5000+ elements, you might want to create a page that simply lists them using that format:
Page Autocomplete:
[
<txp:article_custom form="array_form" ... />
]
Form array_form:
"<txp:title />",
To use this page instead of including all the items in a select field, you'd set up your autocomplete with:
$("#example").autocomplete("<txp:link_to_home />Autocomplete");
You can use a caching plugin to speed up loading.
To speed things up even more, you could use the Textpattern search function with a custom display page instead of using a full listing. There may be a way to set up Autocomplete so that whenever a new character is entered/removed, autocomplete is reloaded with the new search string.