[drupal-devel] [feature] Improved styling of autocomplete matches

Steven drupal-devel at drupal.org
Mon Jun 20 19:07:36 UTC 2005

Issue status update for http://drupal.org/node/24932

 Project:      Drupal
 Version:      cvs
 Component:    base system
 Category:     feature requests
 Priority:     normal
 Assigned to:  Anonymous
 Reported by:  Thox
 Updated by:   Steven
 Status:       patch

...instead of <span class="match">.

By the way Chris, the animated icon is called the throbber and it is
part of core.


Previous comments:

June 13, 2005 - 20:07 : Thox

Attachment: http://drupal.org/files/issues/autocomplete_8.patch (1.39 KB)

I'd like the autocomplete matches to be underlined (or styled in some
way) so that users can see which part of the strings returned was
actually matched. See Screenshot [1].
[1] http://photos14.flickr.com/19139302_0acb27f00d_o.png


June 20, 2005 - 11:04 : Thox

Attachment: http://drupal.org/files/issues/autocomplete_9.patch (1.38 KB)

Using bold instead of underline is much more effective. See screenshot
[2] or my usual autocomplete demo page [3].

New patch attached.
[2] http://photos16.flickr.com/20434923_0760dbda6c_o.png
[3] http://brandedthoughts.co.uk/story/drupal-autocomplete-demo


June 20, 2005 - 16:47 : Chris Johnson

Very nice feedback.  On your demo page, I like the icon in the text
field that indicates active "matching."

One small bug (it seems).  Typing "c" alone gets me a list of matches,
but the last (bottom) entry has a piece of javascript appended to it
with a line through it.

Using Firefox 1.04 on Windows 2000.

Similar bug, but with several lines of javascript fragments in the
match box, appears using MSIE 6 on Windows 2000.


June 20, 2005 - 20:57 : Steven

+1 on the idea, but wouldn't it be better to have the highlighting be
done in a themable function on the server side?

For one thing, it makes it more flexible. But also, the displayed
values can contain HTML, so there might be conflicts with HTML tags in
there if you do a blind search and replace on the client-side. Think
icons/thumbnails, Google Suggest-style popularity counts/indicators,

If bloating the ajax data is a concern, then perhaps the default
themable should use <strong> instead of .

More information about the drupal-devel mailing list