This blog has moved to DotNetSlackers, please update your links and post comments there.UPDATE: 05/07/06: Added a property - ScrollSize - which allows to show the results in a scrolled fashion.
UPDATE: 24/06/06: Fixed the bug affecting Firefox and published sources.
UPDATE: 27/06/06: Now it can be embedded into a UserControl and can retrieve the values from a UserControl method.
ScriptAculoUs is a top quality JavaScript library, useful for everything related to client-side web programming, like effects, DOM programming, events and so on.
Recently they included a new "control" in the package, which is able to extend a normal HTML input text into an autocomplete control. Does this reminds you of the ATLAS autocomplete extender? Read on...
The word "control" is not the same as the one ASP.NET programmers are used to hear, since it now refers to a client-side behavior, which happens completely on the client.
This autocomplete control, whom you can see examples
here, is very rich in features but not very developer-friendly from an ASP.NET developer point of view, because almost everything has to be programmed in the markup code and manually, so I decided to create a custom control to wrap all those functionalities in a simple to use component called ScriptAculoUs.Net.
But why is this better than the other thousand autocomplete controls available out there?
Well, first let me make a brief list of the ones I like most:
- ATLAS Autocomplete extender: very cool, but you need a webservice to retrieve results.
- UPDATE 17/06/06: ATLAS Smart Autocompletion: a textbox built on top of ATLAS framework which incorporates the ATLAS autocomplete extender into a reusable web control, and enhances it by allowing to retrieve the suggestion list from a page method other than the classic web service method.
- Wilco Bauer's SmartTextBox: very well written webcontrol, source code is a must-see, but lacks client-side support.
- AspItalia TextBox Autocomplete: a must see too, can retrieve results from a DataSource control!
Ok, these are the coolest out there. My control can be better because:
- ScriptAculoUs is a client-side library, has great support for visual effects and the result is better than all of them;
- ScriptAculoUs is cross-browser, they mostly aren't;
- ScriptAculoUs is a continuous work in progress, it will improve and I won't have to care about it unless they change the API.
To sum it up, this is better because ScriptAculoUs preserves me from caring about the client-side programming, which is the most part in an autocomplete pattern.
Features
- No need for a web service or an external page to retrieve the suggestions, just a page method, which has to be public, return an object implementing the IEnumerable interface and accept a string as input parameter (the typed keys).
- The support for effects, key navigation and anything else related to client-side behaviors is great thanks to ScriptAculoUs.
- The results are cached on the client.
- Can be easilly configured to show an animated image next to it just using a simple property. The image shows up when the control is retrieving the results from the server and hides when the operation is complete.
- Can be extended to use a AutocompleteProgress control, also shipped, which can be placed anywhere on the page and customized using templates, which makes its content visible when the main control is retrieving results and makes them invisible when the callback is complete. For those using ATLAS, this is the same as the UpdateProgress control.
- You can choose how many chars are needed to be typed before the control performs a callback to the server. The default value is 1.
- The list of results appearance can be customized using some style properties called Suggestionxxx and SelectedSuggestionxxx. Easy to use.
I welcome any feedback and suggestion to improve it. A screencast about how to set it up is available too. Please watch it at double speed since it was recorded on a slow virtual machine, otherwise you risk to fall asleep :-)
Download
Binaries: ScriptAculoUs.Net.bin.zip
Sources:
ScriptAculoUs.Net.src.zip
Screencast: ScriptAculoUs.Net Demo.wmv