0

我有一个创建 jstree 节点的 jQuery each 循环。树节点创建后,我想立即展开它。早些时候,我遇到了一次创建所有节点而不是一次创建一个的问题。

Test(); //this is being called from another function

function Test() {
    var obj = [{'name': 'Frank', 'age': '23'}, {'name': 'Gina', 'age': '29'}];

    $.each(obj, function(){
        CreateTreeNode(this.name); //function from an external js file
        DoSomething(this.name);
    });
};

function CreateTreeNode(node) {
    setTimeout(function(){
        $('<li />', {html: node}).appendTo('#tree > ul');
    },1000);
};

function DoSomething(node){
    alert('doing something else for ' + node);
};

所以我在这个论坛的各种线程的帮助下修改了代码。喜欢:循环使用 .each 并在 Jquery 中延迟

最后我提出了这个创建节点但不扩展它的解决方案。似乎扩展代码在创建节点之前运行。为了展示这个功能,我尝试创建一个简单的 jsFiddle 示例。希望这将有助于解决我的问题。代码片段:

Test(); //this is being called from another function

function Test() {
    var obj = [{'name': 'Frank', 'age': '23'}, {'name': 'Gina', 'age': '29'}];
    var i = -1;
    var delayed = setInterval(function(){
        if(++i < obj.length){
            CreateTreeNode(obj[i].name); //function from an external js file
            DoSomething(obj[i].name); //Expand the node
        } else {
            clearInterval(delayed)
        }
    }, 3000);
    //ExpandAllNodes(); this didn't work too
};

根据其中一位贡献者的请求添加原始代码库(我知道那里的代码很糟糕)。如果没有 setTimeouts,jsTree 不知何故无法工作。我只是使用在外部文件中可用的这段代码,但我可以自由更改,我尝试按照评论部分中的建议进行更改,除了最后一个节点没有展开之外,它几乎可以工作:

function zBuildOrderDetailTreeView() {
    var newOrderOptions = '';
    var interval = 500;
    var index = -1;
    var delayed = setInterval(function () {
        if (++index < m_selectedOrderList.length) {
            newOrderOptions = {
                OrderTitle: m_selectedOrderList[index].ShortDescription,
                orderTypeId: m_selectedOrderList[index].SUBDOMAINS,
                CatalogDescription: m_selectedOrderList[index].ShortDescription
            };

            m_cpoeTree.AddOrder(newOrderOptions, m_cpoeTree.ExpandAllNodes);
        } else {
            clearInterval(delayed);
        }
    }, 500);

    // Expand all the nodes by default
    //setTimeout(function () {
    //    m_cpoeTree.ExpandAllNodes();
    //}, m_selectedOrderList.length * 1000);

}

this.AddOrder = function (options, callback) {
    var orderId = _.uniqueId('order_');

    var orderMetadata = { 
        "orderTypeId": options.orderTypeId, 
        "OrderTitle": options.OrderTitle,
        "ConceptId": options.ConceptId,
        "CatalogDescription": options.CatalogDescription,
        "LOINCCode" : options.LOINCCode, 
        "LOINCDescription" : options.LOINCDescription,
        "LOINCTypeCode" : options.LOINCTypeCode, 
        "CPTCode" : options.CPTCode, 
        "CPTDescription" : options.CPTDescription,
        "SNOMEDCode" : options.SNOMEDCode, 
        "SNOMEDDescription" : options.SNOMEDDescription,
        "Diagnoses": options.Diagnoses,
        "FacilityId" : options.FacilityId == undefined ? '' : options.FacilityId,
        "FacilityName" : options.FacilityName == undefined ? '' : options.FacilityName,
        "DueDate" : options.DueDate == undefined ? '' : options.DueDate,
        "PriorityId" : options.PriorityId == undefined ? '' : options.PriorityId,
        "PriorityName" : options.PriorityName == undefined ? '' : options.PriorityName,
        "FastingId" : options.FastingId == undefined ? '' : options.FastingId,
        "FastingName" : options.FastingName == undefined ? '' : options.FastingName,
        "ContrastId" : options.ContrastId == undefined ? '' : options.ContrastId,
        "ContrastName" : options.ContrastName == undefined ? '' : options.ContrastName,
        "SpecialInstructions" : options.SpecialInstructions == undefined ? '' : options.SpecialInstructions
    };

    var orderClass = '';
    switch (options.orderTypeId) {
        case 1:
            if (!orderMetadata.FacilityName || !orderMetadata.DueDate || !orderMetadata.PriorityName || !orderMetadata.FastingName || !orderMetadata.Diagnoses.names) {
                orderClass = ' invalid';
            }
            break;
        default: 
            if (!orderMetadata.FacilityName || !orderMetadata.DueDate || !orderMetadata.PriorityName || !orderMetadata.Diagnoses.names) {
                orderClass = ' invalid';
            }
            break;
    }

    var orderNode = { "title" : orderMetadata.OrderTitle, "state": "open", "li_attr" : { "id" : orderId, "class" : "order" + orderClass, 
    "metadata" : JSON.stringify( orderMetadata) }, "data" : { "class": "mynode" } };

    var matchingObj = zMatchRequisition(orderMetadata);

    if(matchingObj.matchingOrderFound) {
        return '';
    }

    if (!matchingObj.matchingRequisitionFound) {
        that.AddRequisition(matchingObj, options, orderNode, orderId);
    } else {
        that.AddToExistingRequisition(matchingObj, orderNode, orderId, orderMetadata);
    }

    //Creating the context menu for order node
    zCreateOrderContextMenu();
    callback();
    return '#' + orderId;
};

this.AddRequisition = function (options, orderNode, orderId) {
try {
    var reqUniqueId = ++m_uniqueReqId; // Using global vriable that stores the latest requisition id to use on add
    var reqId = 'requsition_' + reqUniqueId;

    var reqMetadata = { 
        "orderTypeId" : options.orderTypeId,
        "Diagnoses": options.Diagnoses,
        "FacilityId" : options.FacilityId == undefined ? '' : options.FacilityId,
        "FacilityName" : options.FacilityName == undefined ? '' : options.FacilityName,
        "DueDate" : options.DueDate == undefined ? '' : options.DueDate,
        "PriorityId" : options.PriorityId == undefined ? '' : options.PriorityId,
        "PriorityName" : options.PriorityName == undefined ? '' : options.PriorityName,
        "FastingId" : options.FastingId == undefined ? '' : options.FastingId,
        "FastingName" : options.FastingName == undefined ? '' : options.FastingName,
        "ContrastId" : options.ContrastId == undefined ? '' : options.ContrastId,
        "ContrastName" : options.ContrastName == undefined ? '' : options.ContrastName,
        "SpecialInstructions" : options.SpecialInstructions == undefined ? '' : options.SpecialInstructions
    };

    var reqClass = 'someclass';
    var reqNode = { "title" : options.title, "state": "open", "li_attr" : { "id" : reqId, "class" : "requisition" + reqClass, "metadata" : JSON.stringify(reqMetadata) }, "data" : { } };

    var parentNode = -1;
    var requisitionNode = -1;
    var addClass = '';

    setTimeout(function() {
        that.$container.jstree("create_node", parentNode, reqNode, "last", function () {
            // Set up subnodes                      
            setTimeout(function() {
                var facility = reqMetadata.FacilityName == '' ? 'Facility' : 'Facility: ' + reqMetadata.FacilityName;
                addClass = reqMetadata.FacilityName == '' ? ' invalid' : '';
                that.$container.jstree("create_node", $('#' + reqId), { "title" : facility, "state": "closed", "li_attr" : { "id" : reqId + '_facility', "class" : "facility" + addClass }, "metadata" : {}, "data" : { } }, "last");   
            }, 5);

            setTimeout(function() {
                var dueDate = reqMetadata.DueDate == '' ? 'Due Date' : 'Due Date: ' + reqMetadata.DueDate;
                addClass = reqMetadata.DueDate == '' ? ' invalid' : '';
                that.$container.jstree("create_node", $('#' + reqId), { "title" : dueDate, "state": "closed", "li_attr" : { "id" : reqId + '_duedate', "class" : "duedate" + addClass }, "metadata" : {}, "data" : { } }, "last");  
            }, 5);

            setTimeout(function() {
                var priority = reqMetadata.PriorityName == '' ? 'Priority' : 'Priority: ' + reqMetadata.PriorityName;
                addClass = reqMetadata.PriorityName == '' ? ' invalid' : '';
                that.$container.jstree("create_node", $('#' + reqId), { "title" : priority, "state": "closed", "li_attr" : { "id" : reqId + '_priority', "class" : "priority" + addClass }, "metadata" : {}, "data" : { } }, "last");   
            }, 5);

            if (reqMetadata.orderTypeId == 1 ) {
                setTimeout(function() {
                    var fasting = reqMetadata.FastingName == '' ? 'Fasting' : 'Fasting: ' + reqMetadata.FastingName;
                    addClass = reqMetadata.FastingName == '' ? ' invalid' : '';
                    that.$container.jstree("create_node", $('#' + reqId), { "title" : fasting, "state": "closed", "li_attr" : { "id" : reqId + '_fasting', "class" : "fasting" + addClass }, "metadata" : {}, "data" : { } }, "last");  
                }, 5);   
            }                       

            setTimeout(function() {
                var specialInstructions = reqMetadata.SpecialInstructions == '' ? 'Special Instructions' : 'Special Instructions: ' + reqMetadata.SpecialInstructions;
                that.$container.jstree("create_node", $('#' + reqId), { "title" : specialInstructions, "state": "closed", "li_attr" : { "id" : reqId + '_specialinstructions', "class" : "specialinstructions" }, "metadata" : {}, "data" : { } }, "last"); 
            }, 5);

            setTimeout(function() {
                that.$container.jstree("create_node", $('#' + reqId), { "title" : "Orders", "state": "open", "li_attr" : { "id" : reqId + '_orders', "class" : "orders" + reqClass }, "metadata" : {}, "data" : { } }, "last", function() {
                    if (orderNode) {
                        setTimeout(function() {
                            that.$container.jstree("create_node", $('#' + reqId + '_orders'), orderNode, "last", 
                            function() {
                                // Set up subnodes
                                setTimeout(function() {
                                    var diagnoses = reqMetadata.Diagnoses.names == '' ? 'Diagnoses' : 'Diagnoses: ' + reqMetadata.Diagnoses.names;
                                    addClass = reqMetadata.Diagnoses.names == '' ? ' invalid' : '';
                                    that.$container.jstree("create_node", $('#' + orderId), { "title" : diagnoses, "state": "closed", "li_attr" : { "id" : orderId + '_diagnoses', "class" : "diagnoses" + addClass, "title": "Diagnoses: " + options.Diagnoses.names }, "metadata" : {}, "data" : { } }, "last");  
                                }, 2);

                                setTimeout(function() {
                                    var facility = reqMetadata.FacilityName == '' ? 'Facility' : 'Facility: ' + reqMetadata.FacilityName;
                                    addClass = reqMetadata.FacilityName == '' ? ' invalid' : '';
                                    that.$container.jstree("create_node", $('#' + orderId), { "title" : facility, "state": "closed", "li_attr" : { "id" : orderId + '_facility', "class" : "facility" + addClass }, "metadata" : {}, "data" : { } }, "last");   
                                }, 2);

                                setTimeout(function() {
                                    var dueDate = reqMetadata.DueDate == '' ? 'Due Date' : 'Due Date: ' + reqMetadata.DueDate;
                                    addClass = reqMetadata.DueDate == '' ? ' invalid' : '';
                                    that.$container.jstree("create_node", $('#' + orderId), { "title" : dueDate, "state": "closed", "li_attr" : { "id" : orderId + '_duedate', "class" : "duedate" + addClass }, "metadata" : {}, "data" : { } }, "last");  
                                }, 2);

                                setTimeout(function() {
                                    var priority = reqMetadata.PriorityName == '' ? 'Priority' : 'Priority: ' + reqMetadata.PriorityName;
                                    addClass = reqMetadata.PriorityName == '' ? ' invalid' : '';
                                    that.$container.jstree("create_node", $('#' + orderId), { "title" : priority, "state": "closed", "li_attr" : { "id" : orderId + '_priority', "class" : "priority" + addClass }, "metadata" : {}, "data" : { } }, "last");   
                                }, 2);

                                // ONLY for LAB
                                if (reqMetadata.orderTypeId == 1 ) {
                                    setTimeout(function() {
                                        var fasting = reqMetadata.FastingName == '' ? 'Fasting' : 'Fasting: ' + reqMetadata.FastingName;
                                        addClass = reqMetadata.FastingName == '' ? ' invalid' : '';
                                        that.$container.jstree("create_node", $('#' + orderId), { "title": fasting, "state": "closed", "li_attr": { "id": orderId + '_fasting', "class": "fasting" + addClass }, "metadata": { }, "data": { } }, "last");
                                    }, 2);
                                }
                                setTimeout(function() {
                                    var specialInstructions = reqMetadata.SpecialInstructions == '' ? 'Special Instructions' : 'Special Instructions: ' + reqMetadata.SpecialInstructions;
                                    that.$container.jstree("create_node", $('#' + orderId), { "title" : specialInstructions, "state": "closed", "li_attr" : { "id" : orderId + '_specialinstructions', "class" : "specialinstructions" }, "metadata" : {}, "data" : { } }, "last"); 
                                }, 2);

                            }); 
                        }, 200);                            
                    }
                    setTimeout(function() {
                        that.$container.jstree("delete_node", '#jstree_waitingfororders');
                    }, 2);
                }); 
            }, 5);


        }); 
    }, 5);

    return '#' + reqId;

}

jsFiddle

4

0 回答 0