日期:2014-05-16  浏览次数:20280 次

ExtJs4 TreePanel 实例

Ext.app.AdSitePopedomForm = Ext.extend(Ext.Window,
{
    title: '网站功能授权',
    id: 'am-adsitepopedom',
    autoScroll: true,
    xtype: "window",
    width: 400,
    height: 540,
    layout: "absolute",
    modal: true,
    initComponent: function () {
        var userId = Ext.getCmp("am-usergrid").userId;
        var mytree = new Ext.tree.TreePanel({
            id: 'ppdTree',
            x: 5,
            y: 5,
            width: 378,
            height: 470,
            useArrows: true,
            autoScroll: true,
            animate: true,
            enableDD: true,
            containerScroll: true,
            store: new Ext.data.TreeStore
                        ({
                            proxy:
                            {
                                type: 'ajax',
                                url: 'data/User/UserPopedom.aspx?parameter=ppdTree&userId=' + userId
                            },
                            root:
                            {
                                id: 0,
                                text: "选择权限",
                                leaf: false,
                                expandable: true,
                                expanded: true
                            },
                            sorters: [
                            {
                                property: 'leaf',
                                direction: 'ASC'
                            },
                            {
                                property: 'text',
                                direction: 'ASC'
                            }]
                        })
        });
        mytree.on('checkchange', function (node, checked) {
            node.expand();
            node.checked = checked;
            node.eachChild(function (child) {
                child.set('checked', checked);
                child.fireEvent('checkchange', child, checked);
            });
        }, mytree);



        this.items =
        [
           mytree,
			{
			    xtype: "textfield",
			    hidden: true,
			    name: "Id",
			    id: "Id",
			    value: userId
			}
         ];
        this.buttons =
	    [
		   {
		       text: '确认',
		       xtype: 'button',
		       width: 30,
		       handler: function () {
		           var b = mytree.getChecked();
		           var checkids = new Array; // 存放选中id的  数组  
		           for (var i = 0; i < b.length; i++) {
		               if (b.length == 1) {
		                   checkids = b[i].data.id;
		               }
		               else {
		                   if (i < b.length - 1) {
		                       checkids += b[i].data.id + ",";
		                   }
		                   if (i == b.length - 1) {
		                       checkids += b[i].data.id;
		                   }
		               }

		               // checkid.push(b[i].text); // 添加id到数组  
		           }
		           Ext.Ajax.request({
		               url: "data/User/UserPopedom.aspx?parameter=poped",
		               method: "POST",
		               params: { ppdIds: checkids, userId: userId }, //发送的参数
		               success: function (response, option) {
		                   response = Ext.JSON.decode(response.responseText);
		                   if (response.success == true) {
		                       if (response.flag == true) {
		                           Ext.MessageBox.alert("提示", "权限分配成功!");

		                           //关闭当前窗体
		                           var adpoped = Ext.getCmp("am-adsitepopedom");
		                           adpoped.close();

		                           //刷新列表
		                           var adGrid = Ext.getCmp("am-usergrid");
		                           adGrid.store.load();
		                       }
		                       else {
		                           Ext.MessageBox.alert("错误信息", "权限分配失败!");
		                       }
		                   }