ExtJS 刷新后如何默认选中刷新前最后一次选中的节点


Posted in Javascript onApril 03, 2014

在对树节点进行操作后往往需要进行reload操作刷新一下树,但是很多业务都需要在树形刷新后默认选中最后一次选中的节点。这样就必须先保存前一次选中节点的信息,在reload之后再次通过节点的信息进行expand逐层展开到这个节点上。

查询了好久终于找到一个可行的方案,就是通过节点的path来记录节点的位置信息,然后通过path从root节点开始逐层展开,直到最后一个节点。

完成的代码如下:
首先是extjs3.x版本中的方法:

//获取选中的节点 
var node = tree.getSelectionModel().getSelectedNode(); 
if(node == null) { //没有选中 重载树 
tree.getRootNode().reload(); 
} else { //重载树 并默认选中上次选择的节点 
var path = node.getPath('id'); 
tree.getLoader().load(tree.getRootNode(), 
function(treeNode) { 
tree.expandPath(path, 'id', function(bSucess, oLastNode) { 
tree.getSelectionModel().select(oLastNode); 
}); 
}, this); 
}

跟Extjs3.0不同Extjs4.2的写法如下
idPath = selNode.getPath("id"); 
tree.getStore().load({ 
node: tree.getRootNode(), 
callback: function () { 
tree.expandPath(idPath, 'id'); 
} 
});

需要注意的是后台返回的树的json数据时节点必须包含id属性,原本我没有这个属性,但是我把getPath方法中的参数改成其他的一个属性。事实证明这样是达不到效果的,最后在json中添加了id属性才成功的。
Javascript 相关文章推荐
滚动条变色 隐藏滚动条与双击网页自动滚屏显示代码
Dec 28 Javascript
学习js在线html(富文本,所见即所得)编辑器
Dec 18 Javascript
深入了解javascript中的prototype与继承
Apr 14 Javascript
使用javascript:将其它类型值转换成布尔类型值的解决方法详解
May 07 Javascript
js实现兼容性好的微软官网导航下拉菜单效果
Sep 07 Javascript
AngularJS实现的select二级联动下拉菜单功能示例
Oct 25 Javascript
详解vue-router 初始化时做了什么
Jun 11 Javascript
JS基于ES6新特性async await进行异步处理操作示例
Feb 02 Javascript
vue2.0结合Element-ui实战案例
Mar 06 Javascript
在 Vue 中编写 SVG 图标组件的方法
Feb 24 Javascript
原生JavaScript写出Tabs标签页的实例代码
Jul 20 Javascript
vue-router中hash模式与history模式的区别
Jun 23 Vue.js
单击和双击事件的冲突处理示例代码
Apr 03 #Javascript
在jquery boxy中添加百度地图坐标拾取注意流程
Apr 03 #Javascript
邮箱下拉自动填充选择示例代码附图
Apr 03 #Javascript
JS获取网页属性包括宽、高等等
Apr 03 #Javascript
jQuery的$.proxy()应用示例介绍
Apr 03 #Javascript
js实现的复制兼容chrome和IE
Apr 03 #Javascript
JS实现局部选择打印和局部不选择打印
Apr 03 #Javascript
You might like
成本8450万,票房仅2亿,口碑两极分化,又一部DC电影扑街了
2020/04/09 欧美动漫
laravel 实现设置时区的简单方法
2019/10/10 PHP
javascript学习随笔(使用window和frame)的技巧
2007/03/08 Javascript
Javascript改变CSS样式(局部和全局)
2013/12/18 Javascript
JavaScript中的apply和call函数详解
2014/07/20 Javascript
jQuery实现表单步骤流程导航代码分享
2015/08/28 Javascript
Jquery调用iframe父页面中的元素及方法
2016/08/23 Javascript
web 屏蔽BackSpace键实例代码
2016/12/24 Javascript
关于ES6的六个小特性(二)
2017/02/20 Javascript
Bootstrap 3 进度条的实现
2017/02/22 Javascript
Vue + Webpack + Vue-loader学习教程之相关配置篇
2017/03/14 Javascript
详解vue.js2.0父组件点击触发子组件方法
2017/05/10 Javascript
基于Vue的文字跑马灯组件(npm 组件包)
2017/05/24 Javascript
详解Web使用webpack构建前端项目
2017/09/23 Javascript
基于js原生和ajax的get和post方法以及jsonp的原生写法实例
2017/10/16 Javascript
关于jQuery里prev()的简单操作代码
2017/10/27 jQuery
React数据传递之组件内部通信的方法
2017/12/31 Javascript
微信小程序遍历Echarts图表实现多个饼图
2019/04/25 Javascript
如何基于JS截获动态代码
2019/12/25 Javascript
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
2020/05/19 jQuery
在Django中同时使用多个配置文件的方法
2015/07/22 Python
解决pycharm界面不能显示中文的问题
2018/05/23 Python
Python HTML解析模块HTMLParser用法分析【爬虫工具】
2019/04/05 Python
tensorflow实现对张量数据的切片操作方式
2020/01/19 Python
python tkinter的消息框模块(messagebox,simpledialog)
2020/11/07 Python
python实现简单猜单词游戏
2020/12/24 Python
欧洲领先的技术商店:eibmarkt.com
2019/05/10 全球购物
电视购物广告词
2014/03/19 职场文书
给孩子的新年寄语
2014/04/08 职场文书
教师对学生的评语
2014/04/28 职场文书
低碳环保演讲稿
2014/08/28 职场文书
2015年父亲节寄语
2015/03/23 职场文书
2015年禁毒工作总结
2015/04/30 职场文书
电视新闻稿
2015/07/17 职场文书
MySQL 如何限制一张表的记录数
2021/09/14 MySQL
基于Redis结合SpringBoot的秒杀案例详解
2021/10/05 Redis