EasyUI 和 ajax 调用的问题

Question

我正在使用 EasyUI Tree，我正在尝试在父节点和子节点上设置图标。

代码如下：

        $('#inventorytree').tree ({
            url: 'inventory.json',
            method: 'get',
            animate: true,
            lines: true,
            formatter: function (node) {
                var s = node.text;
                var nodeicon = 'icon-blank';
                if (node.children){
                    var onlinecount = 0 ;
                    var offlinecount = 0 ;
                    for (var i = 0; i < node.children.length; i++) {
                                                        var status = IsOnlineAjaxCall(node.children[i].id);
                        if (status == 'true') {
                            onlinecount += 1;
                            node.children[i].iconCls = 'icon-green-dot';
                        } else {
                            offlinecount += 1;
                            node.children[i].iconCls = 'icon-red-dot';
                        }
                    }
                    var chlidrenlength = node.children.length
                    if (chlidrenlength > 0) {
                        if (onlinecount == chlidrenlength) {
                            node.iconCls = 'icon-green-dot';
                        } else if (offlinecount == chlidrenlength) {
                            node.iconCls= 'icon-red-dot';
                        } else {
                            node.iconCls= 'icon-orange-dot';
                        }
                    }
                    s += '&nbsp;<span style=\'color:blue\'>(' + chlidrenlength + ')</span>';
                }
                return s;
            },
        });

我实际上检查节点（网络设备）是在线还是离线。

因为我在 ping 设备，所以我使用 Ajax 调用：

function IsOnlineAjaxCall(deviceid) {
    $.ajax({
        type: "POST",
        url: "Dashboard_v2.aspx/IsOnline",
        data: '{id: "' + deviceid + '" }',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        success: function (data) {
            //alert(data.d);
            var returnstr = data.d.toString;
            return returnstr;
            //return data.d;
        },
        //success: function (data) {
        //    return data;
        //},
        failure: function (response) {
        //alert(response.d);
        }
});

这是我的问题；是的，我有几个：

1) 我无法让树以折叠状态开始。

如果我将状态设置为关闭，那么我得到的最好的结果确实是关闭状态，但空节点有一个加号，当单击它时，它会列出所有父节点。 调用 CollapseAll 的函数永远不会在按钮之外调用。

2) 从 ajax 函数中获取未定义的值

从 ajax 函数运行警报时，我得到了预期的结果：真或假。 一旦值被发送回树定义中的调用函数，我就会得到未定义。 做了相当多的研究，只是无法弄清楚如何解决它。

3) 父节点上的iconCls

在子节点上设置 iconCls 属性（在这个阶段手动）确实可以正常工作。 不考虑在父节点上设置 iconCls。调用属性值，我得到了我刚刚设置的值，但是树没有像为孩子那样显示新图标

非常感谢任何帮助

关于问题 #2 的更新 我正在使用 div 来“存储”来自 ajax 的结果，然后读取值：

    $.ajax({
        type: "POST",
        url: "Dashboard_v2.aspx/IsOnline",
        data: '{id: "' + deviceid + '" }',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        success: function (data) {
            document.getElementById("HidIpStatus").innerHTML = data.d;
        },
        failure: function (response) {
        }
    });

这种变通办法正在奏效，但一定有更好的办法，不是吗？

Answer 1

当您编写一个依赖于 ajax 调用返回值的函数时，除非您使用 promises，否则它将失败。当您调用 IsOnlineAjaxCall() 时，这里发生了什么 - javascript 不知道它需要等待来自 ajax 调用的响应并继续运行，所以状态 == 未定义。如果您阅读此处的文档，您将看到一些如何使用 JQuery deferred.promise() 修复它的示例。很难说，但我认为至少如果你越过这一点，其余部分可能会开始到位。