• 对zTree提出一些改进意见


    说一下,目前我发现最强大的一棵树形菜单还算 zTee

    主页地址为:http://www.baby666.cn/v3/main.php#_zTreeInfo

            我研究 treeview(b/s结构) 的时间加起来,应该有一个月以上了。在传统的webfrom开发中,我把微软自带的treeview真的是玩转了。但是最近遇上了麻烦事,有一个新项目,是用微软的mvc3做的,微软的MVC3不能用服务器控件,我彻底的崩了。

           在网上查了两个半天的资料,先从中文网页,查到外文网页,换了不同的关键字(mvc treeview,mvc tree,mvc 树,jquery treeview,jquery tree, jquery 树,js treeview,js tree, js 树,ext treeview,mootools树,telerik 树.......)都没有找到一个合适的树。

          主要偿试了一下,下边几种树:

          1:dtree:这是我06年的时候用的不亦乐乎的一棵树,就因为这棵对,我爱上了b/s结构的开发。但是不能实现异步加载。

          2:jquery ui 官网的:http://jquery.bassistance.de/treeview/demo/  这棵树真的太简单了,简单的来我花两天都有可能写的出来。demo都只有5个例子。

          3:ext树,这个树不得不赞一下,比较强,但是我不可能为了用一棵对,引入几个超大的js文件。

          4:这时想到了mootools,因为mootools的UI都比较炫。后来考虑不合适,因为现在用mootools框架的人比较少了。

          5:因为我以前做过近两年的telerik的开发,想到了在webform下,telerik的 treeview是天下无敌,想到了telerik的mvc版,去官网一看,是一个半成品,就连勾选了父结点,连子结点都连不中的树。还要收费。

         6:既然都想到了telerik,肯定还要看一下CONE,唉,大同小意。

         这下绝望了。

        我都不想用mvc了,想实现一棵树,就这么难。但是我又想用 mvc 的razor, 还有mvc表单验证。用起真是太爽了。

    我在绝望中,继续翻着网页,找啊,找

    找到了这一篇:http://www.cnblogs.com/xiaoyao2011/archive/2011/10/26/Tree.html

    看到了这个例子:http://baby666.cn/hunter/zTree.html

    看到是用汉语写的,心都凉了半截,国人怎么可能写的出好的树形控件呢,不过我看到这棵对的功能还挺多的,简介吹起

    牛,基本是浏览器都兼容,呵呵,死马当活马医,先测试一下这棵树再说,

    不测不知道,一测吓一条,  哈哈,兼容性还真好,ff, chrome,ie6, ie7,8,9都兼容,对于我来说已经足够了。功能能多,

    扩展函数也多,好的,就选择用ztree了。

    在用的时候,遇上的问题:

    我要在项目中,想实现这种功能:

                                                     (图1)

    先简单的介绍一下,我想实现的功能 :

    1.左边树的节点非常的多,肯定会达到上万个结点,所以必须要实现异步加载。

    2.每个节点有一个名称,还对应一个编码(名称和编码不能重复,所以在添加的时候要与数据库验证),还要有描述。

    3.还要有对结点的CRUD操作(在右边操作的时候,对应操作数据库,左边的结点要实时反应出来)

    就这么几个简单的功能,可是这个我认为目前是网络上流传的,世界上最强大的树,实现起来也有难度。

    一:首先谈删除结点:我选中一个节点,在右边的表单中,显示出来,我点击删除按钮,表单值清空,左边结点树移除。

    用这个控件提供的:removeNode / removeChilds 函数来实现,完全没问题。

    二:再谈修改:editName(),官方提供的这个函数就有问题了。

    当调用这个函数时,出现了如下图的情况:

                                                        (图2)

    这个修改,就比较扯淡了,我没有办法难证这个结点值的有效性,比如名字太长了,或者数据库里有这个名字了。

    后来没办法,发了这个dtree提供了一个

                                                         (图3)

    updateNode()函数,我就在这个函数里做文章了

    a.选中节点的时候,把节点的值,读取到右图1的表单中;

    b.改变表单的值后,点击修改按钮,把值更新到数据库;

    c如果数据库更新成功了再更新树的结点

    三:查看结点。是没有问题的,选中结点,把结点的ID取到,再到数据库读出结点的其它信息,显示到表单中。

    四:新增结点就有问题了。

    因为我这棵对是实的异步加载:当我选中一个这样的结点

                              (图4)

    我调用:addNodes ()函时,把图1右边表单的值收集起来,往数据库里添加一个结点的数据,同时在(父节点2)下添加一个节点,并且展开(父结点2)。问题就出在这儿了(描述:我父结点2下,原来是有结点的,但是我没有点击它,还没有异步加载进来,当我"父结点2"增加了一个结点,结点的个数应该是:我刚增加的结点 加上  我刚创建的结点。)问题就这个操作,会报错,报错也报的比较底层,我看了半天,也没发现怎么来修改这个错误。

    呵呵!!

    后来我用了变通的方法:

    a.我新加一个结点时,我收集图1右边表单的数据,插入到数据库。

    b.我用这个树的结点的异步加载函数:reAsyncChildNodes()

    把当前结点的所有子结点重新加载一次. (这样就实了我刚才加载的结点,和原有的节点都同时显示出来了。)

    到目前为止,在mvc3下,用treeview的问题终于解决了。

    我写这篇日志的目的,我希望大家多转转一下,让写http://www.baby666.cn/v3/demo.php#_109p这个控件树的人看到我写的日志。

    让zTree的作者继续修改和完善这个棵树,成为全球最强的js树。 

    my97_datepicker:这个控件是日历控件的标杆控件。

    我也很希望: zTree是 treeview的标杆控件。

    花了一个小时写这篇日志,太浪费时间了。哈哈

        

  • 相关阅读:
    数据结构与算法(4)——python内置数据类型性能
    数据结构与算法(3)——变位词判断问题
    数据结构与算法(2)——算法复杂度O
    数据结构与算法(1)——图灵机计算模型
    R = [obj for obj in recs[imagename] if obj['name'] == classname] KeyError: '007765'
    关于windows下的libtorch配置
    09异常处理
    08多态与异常
    java07接口与继承动手动脑
    java06作业归档
  • 原文地址:https://www.cnblogs.com/xcj26/p/2293883.html
Copyright © 2020-2023  润新知