Hybrid View

  1. #1
    Sencha Premium Member
    Join Date
    Sep 2009
    Posts
    35
    Vote Rating
    5
    Aldri is on a distinguished road

      0  

    Default Tree recursive search

    Tree recursive search


    I've been developping this functionnality for a project I'm working on, and I though it might be usefull to someone.
    With this small code you can search in any opened node (similar to the CTRL + F function of any program), it searches the next node corresponding to the text you typed.
    But i also added the partial search: use * to match any part of a word --> *word (the searched text ends with the searched word), *word* and word*
    You can easily disable this by removing the red part of the code.
    This code isn't fully perfect, it doesn't take into account any special character used in regexp, if you want it to be safe you should add a filter for these characters (ex: replace * by \*)
    I used a statusbar for the search field and buttons:

    Code:
                bbar: new Ext.ux.StatusBar({
                    defaultText: statusMessage,
                    id: 'right-statusbar',
                    statusAlign: 'right', // the magic config
                    items: [{
                        xtype: 'textfield',
                        blankText: "Enter a word to search...",
                        id: "searchField",
                        width: 150,
                        listeners: {
                            'focus' : function(){
                                var statusBar = Ext.getCmp('right-statusbar');
                                statusBar.setStatus({
                                    text:'Hint: Use * for a partial search.'
                                });
                            }
                        }
                    }{
                        xtype: 'button',
                        text: "Search", 
                        id: "searchButtonOpened",
                        scope: this, 
                        handler: loadFn.createCallback('searchButtonOpened')
                    }]
                })
    The callback function :
    Code:
    var loadFn = function(btn){
            btn = Ext.getCmp(btn);
            var searchText = Ext.getCmp('searchField').getValue();
            if(btn.id == 'searchButtonOpened') {
                if(searchText.substring(searchText.length-1,searchText.length)=="*") {
                    if(searchText.substring(0,1)=="*")
                        searchText = searchText.replace('*','');
                    else
                        searchText = "^"+searchText.replace('*','');
                } else if(searchText.substring(0,1)=="*")
                    searchText = searchText.replace('*','')+"$";
                var tree = Ext.getCmp('tree');
                var searchRoot = tree.selModel.selNode || Ext.getCmp('tree').root; // if no selection use root node
                var searchedNode = searchInAllNodes(searchRoot,searchText,searchRoot.id);
                if(searchedNode) { // if match found, select the node
                    searchedNode.select();
                } else { // else restart search from root (loop)
                    var searchRoot = Ext.getCmp('tree').root;
                    var searchedNode = searchInAllNodes(searchRoot,searchText,searchRoot.id);
                    if(searchedNode) {
                        searchedNode.select();
                    } else { // if no match found at all
                        var statusBar = Ext.getCmp('right-statusbar');
                        statusBar.setStatus({
                            text:'No result'
                        });
                    }
                }
            }
        };
    And finally the recursive search function :

    Code:
    function searchInAllNodes(n,txt,ignoreId){
            var cleanTxt = txt.toLowerCase().replace('*','').replace('$','').replace('^','');
            if(n.id!=ignoreId && n.text.toLowerCase().match(txt.toLowerCase()) && n.text.toLowerCase().match(cleanTxt)) {
                return n;
            } else {
                if(!n.hasChildNodes() && n == n.parentNode.lastChild) { // si le noeud n'a pas d'enfants et est le dernier de la branche
                    if(n.parentNode.nextSibling != null) {
                        var res = searchInAllNodes(n.parentNode.nextSibling,txt,ignoreId);
                        if(res != 0) // si on retourne autre chose que 0 --> bingo
                            return res;
                        return 0;
                    } else
                        return 0;
                } else {
                    for(var i=0; i<n.childNodes.length; i++)
                    {
                        var res = searchInAllNodes(n.childNodes[i],txt); // check dans chaque noeud enfant
                        if(res != 0) // si on retourne autre chose que 0 --> bingo
                            return res;
                    }
                    if(n.nextSibling != null) {
                        var res = searchInAllNodes(n.nextSibling,txt,ignoreId);
                        if(res != 0) // si on retourne autre chose que 0 --> bingo
                                return res;
                    }
                    return 0; // si on n'a eu que des 0, on retourne 0
                }
            }
        }
    Last edited by Aldri; 16 Oct 2009 at 6:07 AM. Reason: bug fix

  2. #2
    Sencha Premium Member
    Join Date
    Apr 2011
    Posts
    26
    Vote Rating
    0
    Link_ is on a distinguished road

      0  

    Default Search more than one occurrence in the tree have a button next

    Search more than one occurrence in the tree have a button next


    Hello Aldri,

    If I may, I would like to know how you build this function, the possibility of finding more than one occurrence in the search?

    hugs,

    Hugo

  3. #3
    Sencha Premium Member
    Join Date
    Sep 2009
    Posts
    35
    Vote Rating
    5
    Aldri is on a distinguished road

      0  

    Default


    Wow you are a grave digger, my post is 4 years old
    All of this was developped for an old version of Ext JS, it's probably not usable anymore...

  4. #4
    Sencha Premium Member
    Join Date
    Apr 2011
    Posts
    26
    Vote Rating
    0
    Link_ is on a distinguished road

      0  

    Default


    Thanks for responding to my post my friend!
    I made a small adjustment to your code to Extjs4 and worked perfectly. Your code helped me a lot.

    The problem is that in my case, there are more than one occurrence of the search tree.

    You made some function better than the one you created for the version of ExtJS4 that could provide for me?

    hugs

  5. #5
    Sencha Premium Member
    Join Date
    Sep 2009
    Posts
    35
    Vote Rating
    5
    Aldri is on a distinguished road

      0  

    Default


    Sorry, I haven't used this code for a long time, it was made for a client and I don't event have access to the source code anymore since I left the company I was in at this time...
    But I don't think that I did what you are looking for, sorry !

  6. #6
    Sencha Premium Member
    Join Date
    Apr 2011
    Posts
    26
    Vote Rating
    0
    Link_ is on a distinguished road

      0  

    Default


    Anyway thank you for your attention.


    If a colleague is reading this post and can help me create a function like yours, but you have the possibility to search the term if more than one, I would greatly appreciate it.


    hug

Thread Participants: 2

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi