Filtering nodes in dynatree

Question

I've just got to grips with dynatree, custom styles and ajax calls to populate the tree. All works brilliantly.

However I then needed to add a filtering capability to the nodes, just like here:http://fancytree.googlecode.com/hg-history/ac202f4b6cba34b240e4cad294e2283e7272fbeb/demo/sample-ext-filter.html

Unfortunately this is for fancytree and not dynatree. I spent approximately 5 hours trying to get my code to use fancytree instead of dynatree and I'm at a point of extreme frustration as it just won't work, the error messages are garbled, the documentation is appalling and there is precious little on the internet about it.

I'd rather stick with dynatree, which just works. Is there any way I can implement the filter shown in the fancytree example in dynatree instead? I'm too much of a javascript noob to understand what the code is trying to do.

There is a similar question if you want to check it out. stackoverflow.com/questions/12277797/… — Vignaz

Minesh Minesh · Accepted Answer · 2013-06-18T10:30:31

Try below:

Textbox HTML:

 Filter : <input type="text" name="filter" id="filter" />

JavaScript:

      $('#filter').keypress(function() {
            if($(this).val().length >=2 )
                {
                    var $input = $(this);
                    $(".dynatree-title").each(function(){
                        if($(this).text().toLowerCase().indexOf($input.val().toLowerCase()) >= 0) {
                            $(this).html("<font color='blue'>"+$(this).text() +"</font>");
                            alert($(this).text());
                        }
                    });
                }
        });

Filtering nodes in dynatree

1 Answers