I've been working on a problem today and wanted to share the results
here. I have a very tall list of authors on a page, and wanted to make
a simple filter field where you could type in a few characters of the
name and have the list shrink down to only include matches. After
struggling for an hour or more with various different methods, I
finally stopped trying to swim upstream and did less.
I was using a Form.Element.Observer, but inside that function I was
using an optimized (backwards) for loop to iterate over my found array
of list items, and toggling visibility on each one in turn. This was
taking forever, causing a beachball on an 8-core Mac Pro in Firefox (I
shudder to think what would happen in a lesser Mac).
I was looking through the various enumerable options and saw reject,
and then select, and the lightbulb went on:
document.observe("dom:loaded",function(){
var t = $$("#listAll li");
var f = $F("filter");
new Form.Element.Observer(
"filter",
0.2,
function(el, value){
if(value != f){
t.invoke('hide');
t.select(function(elm){
return
elm.down('a').innerHTML.toLowerCase().include(value.toLowerCase());
}).invoke('show');
f = value;
}
}
)
});
This behaves the way you would want it to -- so fast that the change
doesn't register until the list starts getting very short.
Walter
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
