Pergunta

I need to use a searching function for my dynatree and so I found this workaround: JQuery Dynatree - search node by name

However, I need to have it search only up until my expanded node delimiter. (I am using jQuery ui-slider to dynamically set the expand delimiter). Initially, I need it to search until my minExpandedLevel. And if I move the slider, the dynatree should show only matching results in expanded level equivalent to the slider value.

Trying to reset the minExpandLevel and reloading the dynatree just wont do as it returns all(even non-matching) nodes as result.

So I want to add a limit parameter to the search function like:

$(selector).dynatree("getRoot").search(pattern, limit);

Does anybody know how to do this?

Here's my code:

dynatree:

$.ui.dynatree.nodedatadefaults["icon"] = false;

$("#resultTree").dynatree({
    minExpandLevel: 4,
    persist: false,
    classNames: {
        vline: "no-bg",
        connector: "",
        expander: "ui-helper-hidden"
    },
    children: myJsonData
});

slider:

timeout = false;
searchTerm = $("#searchText").val();
$("#treeslider").slider({
    min: minTick,
    max: maxTick,
    range: "min",
    slide: function (event, ui) {
        if (timeout) {
            clearTimeout(timeout);
        }
        timeout = setTimeout(function () {
            $("#resultTree").dynatree("getRoot").search(searchTerm, ui.value);
        }, 500);

    }
});
Foi útil?

Solução 2

Okay, I think I found the answer:

I modified the _searchNode function so it will hide matching nodes greater than the level delimiter, but will show parent node(even non-matching) as long as the term matches within its children.

var clear = true;
DynaTreeNode.prototype.search = function (pattern,limit) {
if (typeof limit == "undefined") {
    limit = 0;
}

if (pattern.length < 1 && !clear) {
    clear = true;
    this.visit(function (node) {
        node.expand(true);
        node.li.hidden = false;
        node.expand(false);
    });
} else if (pattern.length >= 1) {
    clear = false;
    this.visit(function (node) {
        node.expand(true);
        node.li.hidden = false;
    });
    var searchDepth = 1;
    for (var i = 0; i < this.childList.length; i++) {
        var hide = { hide: false };
        this.childList[i]._searchNode(pattern, hide, searchDepth, limit);
    }
}
},

// bottom-up node searching function
DynaTreeNode.prototype._searchNode = function (pattern, hide, searchDepth, limit) {
    var level = searchDepth;
    if (this.childList) {
        // parent node
        var hideNode = true;
        var searchDepth = level+1;
        for (var i = 0; i < this.childList.length; i++) {
            var hideChild = { hide: false };
            this.childList[i]._searchNode(pattern, hideChild, searchDepth, limit);
            hideNode = hideNode && hideChild.hide;
        }

        if (hideNode && !this._isRightWithPattern(pattern)) {
            this._hideNode();
            hide.hide = true;
        } else {
            if (limit && level > limit) {
                this._hideNode();
            }
            hide.hide = false;
        }

    } else {
        // leaf        
        if (!this._isRightWithPattern(pattern)) {
            this._hideNode();
            hide.hide = true;
        } else {
            if (limit && level > limit) {
                this._hideNode();
            }
            hide.hide = false;
        }
    }
}

Outras dicas

Here's a snippet of code that starts at the root and visits each node but doesn't process nodes at level 3 or lower:

$("#tree").dynatree("getRoot").visit(function(node){

    if( node.getLevel() > 2) {
        return 'skip';
    }

    console.log('processing node "' + node.data.title + '" at level ' + node.getLevel());

});

The visit function will stop processing a branch if you return the string 'skip'.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top