小菜使用如下代码生成TreePanel,代码与ExtJs自带的examples类似,在Firefox下运行正常,不过在IE下无法正常显示。


Code
<script language="JavaScript" type="text/javascript">
    <!--
    Ext.BLANK_IMAGE_URL = '../resources/ext/resources/images/default/s.gif';

Ext.onReady(function() {
        var ddTree = new Ext.tree.TreePanel({
            el: 'ddTree',
            useArrows: true,
            enableDD: true,
            width: 200,
            height: 300,
            loader: new Ext.tree.TreeLoader({
                dataUrl: "xxx.ashx"
            }),
            rootVisible: false,
            root: new Ext.tree.AsyncTreeNode({}),
            listeners: {
                'beforeload': beforeloadHandler,
                'load': loadHandler
            }
        });

ddTree.render();
        ddTree.expandAll(); // 展开所有结点

     var loading = null;
        function beforeloadHandler() { // 加载前事件响应处理
            loading = new Ext.LoadMask(Ext.get(ddTree.getEl()), { msg: "请等待" });
            loading.show();
        }

function loadHandler() { // 加载后事件响应处理
            loading.hide();
        }
    });
    -->
    </script>

分析问题:
1、是否是xxx.ashx出现异常?
     使用Firefox工作正常,所以排除,并且通过Firebug取到xxx.ashx输出json数据如下,所以该可能排除。
[{"id":59,"text":"web development","leaf":false,"children":[{"id":60,"text":"asp.net","leaf":false,"children":[]},{"id":61,"text":"php","leaf":false,"children":[]}]},{"id":62,"text":"web development","leaf":false,"children":[{"id":63,"text":"asp.net","leaf":false,"children":[]},{"id":64,"text":"php","leaf":false,"children":[]}]}]

2、TreePanel不兼容IE?
  这显然是个笑话。不过可以验证下,将Firebug取到的json数据放入root结点的children: json。在IE下工作正常。所以该可能排除。
3、TreeLoader在IE下工作不正常?
  暂时其它可能排除了,所以就它最可能了。
  那怎么解决呢?可以使用Ajax取到xxx.ashx传来的数据,然后转为json放入root结点的children就ok了。试下。

Code
<script language="JavaScript" type="text/javascript">
    <!--
    Ext.BLANK_IMAGE_URL = '../js/ext/images/default/s.gif';

Ext.onReady(function() {
        var forumTree = new Ext.tree.TreePanel( {
            el: 'forumtree',
            useArrows: true,
            enableDD: true,
            width: 200,
            height: 300,
            rootVisible: false,
            root: new Ext.tree.AsyncTreeNode({})
        });
        
        forumTree.render();
        
        // 加载提示
        var loading = null;
                
        function showLoading() {
            loading = new Ext.LoadMask(Ext.get(forumTree.getEl()), { msg: "请等待" });
            loading.show();
        }

function hideLoading() {
            loading.hide();
        }
        
        showLoading();
        
        // 由于使用TreeLoader在IE下无法正常加载数据,所以使用Ajax先获取数据再填充数据到root node下 
        Ext.Ajax.request({
            url: 'xxx.ashx',
            success: function(request) {
                var data = Ext.util.JSON.decode(request.responseText);
                forumTree.getRootNode().appendChild(data);
                forumTree.getRootNode().expandChildNodes(true);
                
                hideLoading();
            },
            failure: function() {
                hideLoading();
                
                Ext.MessageBox.show({
                    title: '版块管理',
                    msg: '对不起,加载数据出现异常,请重试!',
                    buttons: Ext.MessageBox.OK,
                    icon: Ext.MessageBox.ERROR
                });
            }
        });
    });
    -->
    </script>

问题解决。。。

不过这样我们又会碰到一个问题,就是当CRUD这个树结点提交到Server后,如何刷新Tree。如果只是重新调用Ajax。会有重复的结点出现。
因为上面使用的是在root下用appendChild来实现。所以刷新时应该先删除root下的所有子结点。怎么删呢?
forumTree.root.removeChildNodes()?噢,sorry。这个方法不存在。简单我们自己来一个。

Code
function removeChildNodes(node) {
            while(node.firstChild) {
                removeChildNodes(node.firstChild);
            }
  
            if(node.getDepth() != "0") {
                node.remove();
            }
        }

在刷新的时候只要把forumTree.root传入该方法就可以了。

转载于:https://www.cnblogs.com/wliang22/archive/2011/02/24/1964163.html

ExtJs TreePanel使用TreeLoader在IE下无法正常加载显示的解决方法相关推荐

  1. windows10系统下mfc100u.dll加载失败的解决方法

    今天通过SecureFX.v.8.0-kg.exe激活程序时,提示mfc100u.dll丢失,加载失败. 经过尝试,最终下载Microsoft Visual C++ 2010 Service Pack ...

  2. mysql正在加载_本地坏境或者服务器环境下phpmyadmin出现始终正在加载问题的解决方法...

    可能很多使用php免备案虚拟主机的用户感觉这个标题非常神奇,为什么呢,说是虚拟空间要怎么设置呢,这个问题就不是您担心的问题了,您应该问问空间商为什么了,当然这个前提下要保证自己的网络畅通无阻,认为本地 ...

  3. C# .NET CORE在linux下读取图片加载到文档方法 Gdip libgdiplus

    .net在window平台使用的图片替换及绘画功能using System.Drawing; 在.net core使用runtime.osx.10.10-x64.CoreCompat.System.D ...

  4. 天地图服务在https协议下请求正常加载显示地图

    首先把需要使用的天地图服务,如矢量地图服务地址如下: //天地图矢量服务 "http://t0.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQ ...

  5. 怎么样给下拉框加载背景色

    选择自 PPLUNCLE 的 Blog 部分代码: ------aspx页面:  <tr>  <td><select id="job" name=&q ...

  6. 多线程下ArrayList类线程不安全的解决方法及原理

    多线程下ArrayList类线程不安全的解决方法及原理 参考文章: (1)多线程下ArrayList类线程不安全的解决方法及原理 (2)https://www.cnblogs.com/fangting ...

  7. 虚拟机下Ubuntu没有GUI图形界面,解决方法

    虚拟机下Ubuntu没有GUI图形界面,解决方法 参考文章: (1)虚拟机下Ubuntu没有GUI图形界面,解决方法 (2)https://www.cnblogs.com/echohao/p/5895 ...

  8. 【Linux笔记】CentOS下找不到eth0设备的解决方法

    [Linux笔记]CentOS下找不到eth0设备的解决方法 参考文章: (1)[Linux笔记]CentOS下找不到eth0设备的解决方法 (2)https://www.cnblogs.com/ly ...

  9. Ubuntu下vi编辑器方向键变成字母的解决方法

    Ubuntu下vi编辑器方向键变成字母的解决方法 非常简单的一个操作,只需2步,完美解决Ubuntu下vi编辑器方向键变字母的问题. 一.执行命令 sudo apt-get remove vim-co ...

最新文章

  1. h5 数字变化_前端/h5 D3.js实现根据数据动态更新图形/类似进度实时变化效果
  2. ExtJS中给Tree节点加click事件
  3. C++ 线程池的思想
  4. Failed to execute
  5. 通过Java Hipster升级Spring Security OAuth和JUnit测试
  6. DOM 基础 HTML标签 元素 属性
  7. MFC中Combo 下来菜单不能展开(只显示一点点)
  8. 开源监控解决方案Nagios+Cacti+PNP4Nagios+NConf+NDOUtils+Nagvis(九)NagVis安装
  9. 为什么没人会 COBOL 编程了?
  10. velocity参数重新赋值_Velocity 语法详解
  11. pta:人民币与美元汇率兑换程序(python)
  12. san分布式共享文件系统_SAN存储区域网络共享软件全攻略
  13. 华为S9306交换机版本升级及补丁安装步骤
  14. 这是一个只有一句话的木MA
  15. 闭环系统的零极点图判定稳定性_实验五 线性系统的稳定性和稳态误差分析
  16. 【Yocto学习入门】03 - Yocto 代码初步了解
  17. gpa2.8申请美国计算机硕士,GPA2.8的她,跨专业申请到美国匹兹堡大学 | HGCP美国本科留学...
  18. Retrofit教程
  19. RBF神经网络——基于近红外光谱的汽油辛烷值预测
  20. 中华云盒M1刷Linux教程,再谈中华云盒M1刷机详细教程,包教包会终结版

热门文章

  1. terminal显示mysql_mac如何在terminal终端中操作mysql
  2. php编写一个学生类_PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能
  3. 前景检测算法(五)--GMM,GMM2,GMG
  4. 大三寒假--算法复习
  5. ggplot2分面柱状图柱子比例一致_R语言柱状图
  6. 嵌入式系——软件管理工程
  7. 控制反转(IOC)入门
  8. [转] Noise Contrastive Estimation 噪声对比估计 资料
  9. 意超级杯尤文小胜AC米兰 C罗获转会后首个冠军
  10. MySQL数据库设置主从同步