上一篇
ExtJs4树形下拉菜单
【welkin】
    ExtJs4中自带了扩展下拉组件,下面介绍一下如何使用
    1、首先引入TreePicker.js,这个文件在下载的extjs4的Demo中可以找到
    需要注意的是
    (1)若jsp页面中写ext代码,则需要将TreePicker.js通过引用的方式引入
    (2)若ext写在单独的js文件中,则需要通过Ext.require(['Ext.ux.TreePicker']);方式引入
    2、将TreePicker.js引入后下面就可以直接使用了,代码格式和ext combox差不多,具体代码如下(这里实现的是动态下拉树)



    3、最后在后台组织json数据



    其中isLeaf(menu.getMenuId())是根据获取到的数据在重新获取一遍数据,若可以查到数据,则证明该节点是非叶子节点
    4、数据库中的数据格式为menuid parentId
    5、树形下拉菜单默认是显示根节点的,显然,在项目中这个是不合适的,在上面的代码中添加了rootVisible:false却不起作用,无奈之下只能修改TreePicker.js的源码了。修改内容如下:
    在此处代码picker = new Ext.tree.Panel({ 下添加rootVisible: false即可,这样所有的树形下拉菜单默认就不显示根节点了。
    OK!至此一个完整的Ext下拉树就搞定了。看下效果图: