ztree实现用友NC631中树的模糊查询及NC631的bug描述

第一部分：用友NC631的部门树模糊查询的bug

（此bug仅代表作者使用的这个版本的这套软件出现的问题，不代表所有NC6系列都有这样的问题）

测试环境为数据泵还原的demo，实际实施的环境经测试，问题一样。

分别经IE、UClient测试，均会出现如下错误信息：（截图为UClient环境）

根据搜索条件过滤后的树，直接修改后

一、树节点与表体input中的内容不一致。

二、而后的清空动作执行不完全。

三、最后清空按钮直接无法隐藏。

操作步骤如下：

1、搜索条件“办公室”

2、点击 “办公室” 进行 “修改” → “保存” 后，表体与树节点信息不一致

3、再次选中 “02办公室” 节点时，表体中的input值又显示为“办公室”

4、点击 菜单栏“刷新”

5、如果 第4步不点 “刷新”，直接点搜索框内显示的 清空按钮 小叉叉，

a.正常逻辑应该清空input中的所有内容，再显示刚刚被隐藏的所有节点。

b.实际操作，input中的字符没有完全清空，且 清空按钮 小叉叉 仍然显示

6、通过 对input焦点的进入和移出，清空按钮依旧存在，与搜索小图片并存。反复点击清空按钮除了样式变化，其他无反应。

7、此时的 清空按钮小叉叉是怎么点都不把自己隐藏起来 - -#

a.点击菜单栏的新增、复制、查询、刷新、过滤、多版本都不行。

b.“部门”tab 与其他 tab 切换 也不行。

消除方法：

1、再次在input中输入值后，点击 清空按钮小叉叉。

2、把“部门”tab 关闭后，重新打开。

第二部分：ztree实现用友NC631中树的模糊查询

后台使用 SSH，利用struts2的json插件传递json数据。

前台使用jquery+easyui+zTree等。

通过大量的查询，网络上关于zTree的模糊查询主要有三种方案：

1、通过api getNodesByParamFuzzy 得到nodelist，然后修改nodelist里面所有的节点的样式。

http://blog.csdn.net/wangjingna/article/details/50488921

2、通过apigetNodesByParamFuzzy 得到nodelist，直接显示到树容器中。

http://www.cnblogs.com/spring_wang/p/4112891.html

3、通过apigetNodesByFilter(3.X版本才有) 结合 indexOf(xxx)!=-1 的方案。

http://blog.csdn.net/danielpei1222/article/details/52078013

以上三种用户体验都不好。

第一种，虽然通过样式改变，保留了树结构本身的同时能让客户直接找到符合查询条件的节点。

但是，本身化繁为简的查询本质，却变成了化简为繁。如果树特别巨大，单纯的样式改变就变的特别累赘。让人看的特别费劲。

第二种，是另一个极端，只展示所需要的节点，而忽略了树本身特有的结构特性。

第三种，比较接近用友NC631的部门树模糊查询，但是其过滤条件比较简单，只要是父节点，利用indexOf(xxx)!=-1满足查询条件的就不隐藏，

这样就会让人觉得做事做了一半，如果树稍微复杂点，父节点稍微多点。那么这样的查询基本就可以忽略不计了。

通过反复测试，使用ztree3.5的getNodesByFilter是更好的方案。

下面上效果图：

1、 刚打开页面，默认选中根节点，展开根节点往下第一级子节点。

2、 输入查询条件“q”或“秦”或“虹”，我们要查的结果是“秦虹”

3、 选中“秦虹”

 

4、 点击“修改” 将名称改为 “秦虹_雅居乐”

5、点击“保存”

6、 整个修改过程，后台只执行一条sql，前台使用 api：updateNode即可。

js代码正在整理，后面会贴上来。