ExtJs 学习笔记2

项目一忙起来就没谱，结果Ext JS 就抛弃了很久也没过问了。

?? 这几天稍稍有点闲暇时间，没事翻了翻那本搁置了许久的书，用Ext JS 的库做了几个小控件，也移到了项目中的一个小页面用了用。个人感觉还不错，除了加载速度稍稍有点慢。网上相传Ext 很耗性能，现在使用的人越来越少了，个人感觉，Ext 也就是个工具库，应用它要结合自己的项目，看有没有可适用性，不要因用Ext 而去用，而是要用Ext 能发挥其优势再考虑去用，然后就是怎么用，怎么去优化了。

??? 学Ext ,它自带的示例是最好的学习文档，当然，还有API，找一个小型服务器(个人使用的是resin)，把ext 包部署上去，就能顺畅流利的访问ext 里面的各种文档了。

/**   * @name showWindow.js   * @remark 弹出一个选择员工的面板   * @author ceetao@foxmail.com   * @version 1.0   * @crateDt 2009.7.10   */ var tree = new Ext.tree.TreePanel({           useArrows:true,           autoScroll:true,           animate:true,           enableDD:true,           containerScroll: true,           rootVisible: false,           frame: true,           root: {               nodeType: 'async'          },                      loader:new Ext.tree.TreeLoader({         dataUrl:"extjs/check-nodes.json"          }),                      listeners: {               'checkchange': function(node, checked){                   if(checked){                       node.getUI().addClass('complete');                   }else{                       node.getUI().removeClass('complete');                   }               }           }   });  var win = new Ext.Window({    el:'test',    title:'员工列表',    layout:'fit',    //布局方式    width:400,    height:300,         maximizable:true,   //最大化按钮    minimizable:true,   //最小化按钮，点击时需要重写事件或方法    closeAction:'hide',   //关闭窗口是隐藏还是彻底关闭销毁    modal:true,     //底色是否被灰不可用    constrain:true,    //窗口移动不允许超出边界    animateTarget:'target',  //弹出窗口动画效果    buttonAlign:'right',  //按钮位置    items: [     //包含内容     tree    ],    buttons: [{     text:'确定',     handler:function(){            var msg = '',selNodes = tree.getChecked();      Ext.each(selNodes, function(node){                   if(msg.length > 0){                       msg += ', ';                   }                   msg += node.text;               });                                          Ext.Msg.show({                   title: '所选员工',                    msg: msg.length > 0 ? msg : '没有选择员工',                   icon: Ext.Msg.INFO,                   minWidth: 200,                   buttons: Ext.Msg.OK               });     }    },{     text:'取消'   }]   }) 

?

一个弹出选择员工的列表框的js，稍稍的把自带的样例改了改，实际应用中还可以做的更复杂，比如，tree 各个子节点的异步加载数据，修改节点名称，数据过滤等等。