>http://fra.orkos.com/produits/tarifs.aspx Here is a page which I made.
>This
>page presents a list of products classified in a hierarchy. I have a
>textbox
>that allows the user to filter these products. Try to type a text in this
>textbox (for example the word "apple") and observe the speed of filtering.
>If you have a sufficient screen resolution you can also see that the
>hierarchy at left hand side is filtered at the same time. The only problem
>is that I need a hundred lines of script to do this...
>When I discovered jquery, I wanted immediately to remake this script to see
>how shorter the script could be. I was however quickly stopped by the
>performances... http://fra.orkos.com/tests/pricelist/ Here , you can see
>the same page but the research script has been replaced by two jquery lines
>of code. (the script is slow and may blocks the browser during a few
>seconds. Do not stop script, it will not block you a long time)
>
>$(".Name").parents("tr").hide(); //hide all the lines
>$(".Name:contains('"+tbxValue+"')").parents("tr").show(); //then display
I think you're going about this the wrong way. You're doing a lot of DOM
parsing here.
I'd try something like:
$(".Name").each(
function (){
// create a pointer to the current table cell
var oCell = $(this);
// hide the parent
oCell.parent().[oCell.text().indexOf(tbxValue) > -1 ? "show"
: "hide"]();
}
);
This should only parse through the tree one time deciding whether to
hide/show each row.
I choose not to use the contains() selector, because I'm not sure how will
it performs.
-Dan
