Ext 两个Window共用同一个Form样例 -

yunhan

浏览: 10654 次
性别:
来自: 上海

最近访客更多访客>>

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (9)

社区版块

存档分类

Ext 两个Window共用同一个Form样例

EXT C C++C#

var record;
var objbusinesstypetext="";
var addform;
var queryform;
var isCompanyForm;
var securityForm;
var mydata;
var temPanel = new Ext.Panel({
        region: 'center',
        layout: 'fit'
})

Ext.onReady(function(){
showMainForm();
});

function showMainForm()
{
mydata = [
['粤A12345','粤A12345'],
['粤A12345','粤A12345'],
['粤A12345','粤A12345']
];

var driverStore = new Ext.data.SimpleStore({
fields:['value','text'],
data: mydata
})

var mydata1 = [
['dazhuan','大专'],
['benke','本科'],
['shuangxueshi','双学士'],
['shuoshi','硕士'],
['boshi','博士'],
['fujiaoshou','副教授'],
['jiaoshou','教授']
]

var xueliStore = new Ext.data.SimpleStore({
fields:['value','text'],
data:mydata1
})

//弹出框中的FormPanel
addform=new Ext.FormPanel({
    region:'center',
id:'formaddform',
name:'formaddform',
frame:true,
monitorValid:true,   // 把有formBind:true的按钮和验证绑定
items:[{
layout:'column',
items:[{
columnWidth:.5,
                layout: 'form',
                items: [{
                    id:'addformUserLoginId',
xtype:'textfield',
fieldLabel: "<span style='color:#F00'>*</span> "+'用户登录名',
name: 'userLoginId',
allowBlank:false,
        blankText:"不能为空，请填写"
                },
                {
                    fieldLabel: "<span style='color:#F00'>*</span> "+'密码',
        xtype:'textfield',
        name: 'currentPassword',
        id: 'pass',
        inputType: 'password',
        allowBlank:false,
        blankText:"不能为空，请填写"
                },{
      id:'currentPasswordVerify',
        fieldLabel: "<span style='color:#F00'>*</span> "+'密码确认',
        xtype:'textfield',
        name: 'currentPasswordVerify',
        vtype: 'password',
        initialPassField: 'pass',
        inputType: 'password',
        allowBlank:false,
       blankText:"不能为空，请填写"
      },
      {
xtype:'textfield',
fieldLabel: "<span style='color:#F00'>*</span> "+'姓名',
name: 'userName',
        vtype:'R25',
        allowBlank:false,
       blankText:"不能为空，请填写"
},{
xtype:'textfield',
fieldLabel: '员工编号',
name: 'userNo',
        vtype:'R25'
},new Ext.form.DateField({
                        fieldLabel: '出生日期',
                        name: 'birthDate',
                        format:'Y-m-d'
        }),
        {
        fieldLabel:"<span style='color:#F00'>*</span> "+"状态",
            layout:"table",
            items:[{
               xtype:"radio",
               boxLabel:"启用",
               name:"enabled",
               inputValue:"Y",
              checked: true
             },{
               xtype:"radio",
              boxLabel:"作废",
               name:"enabled",
               inputValue:"N"
     }]
    },{
xtype:'textfield',
fieldLabel: '备注',
name: 'comments'
}
        ]
},{
        columnWidth:.5,
                layout: 'form',
                items: [
                {
        fieldLabel:"性别",
            layout:"table",
            items:[{
               xtype:"radio",
               boxLabel:"男",
               name:"gender",
               checked: true,
               inputValue:"1"
             },{
               xtype:"radio",
               boxLabel:"女",
               name:"gender",
               inputValue:"0"
     }]
    },{
xtype:'textfield',
fieldLabel: '地址',
name: 'userAddress'
},{
xtype:'textfield',
fieldLabel: '联系电话',
name: 'userPhone'
},{
xtype:'textfield',
fieldLabel: '邮编',
name: 'postcode'

},{
xtype:'textfield',
fieldLabel: 'email地址',
name: 'userEmail',
vtype:'email'
}]
}]

}],
buttons:[{text:"提交",formBind:true,handler:function (){

}}],
buttonAlign:'center'
});

queryform = new Ext.FormPanel({
applyTo:'ImportMainFormDiv',
    region:'north',
    animCollapse:false,
    collapsible: true,
        frame: true,
        monitorValid: true,
        height: 110,
        title: "系统管理－用户信息查询",
        layout: 'column',
        items: [{
            columnWidth: .25,
            layout: 'form',
            items: [{
                xtype: 'textfield',
                fieldLabel: '用户登录名',
                name: 'brandName',
anchor:'92%',
            }]
        },{
            columnWidth: .25,
            layout: 'form',
            items: [{
          xtype:'textfield',
        fieldLabel: '用户姓名',
        name: 'category1',
format:'Y-m-d H:i',
anchor:'92%'
}]
        }],
        buttons: [
{
            text: "创建",
            handler: create,
            formBind: true
        },
        {
            text: "查询",
            //handler: selectData,
            formBind: true
        },
        {
            text: "重置",
            //handler: reset,
            formBind: true
        }],
        buttonAlign: 'center'
    });

var sm=new Ext.grid.CheckboxSelectionModel();
//var rowNumberer = new Ext.grid.RowNumberer();
var colModel = new Ext.grid.ColumnModel([
{header: "用户登录名", sortable: true, dataIndex: 'loginName'},
{header: "用户姓名", sortable: true, dataIndex: 'userName'},
{header: "性别", sortable: true, dataIndex: 'sex'},
{header: "操作", renderer:renderLocation, dataIndex: 'operation'}
]);

    var simpleData = [
        ['zf','张飞','男'],
        ['gy','关羽','男'],
        ['zz','小赵','男'],
        ['mc','马超','男'],
        ['ah','老黄','男'],
        ['zg','诸葛老儿','男']];

    var store = new Ext.data.Store({
        proxy: new Ext.ux.data.PagingMemoryProxy(simpleData),
        remoteSort:true,
        sortInfo: {field:'organizationName', direction:'ASC'},
        reader: new Ext.data.ArrayReader({
            fields: [
   {name: 'loginName', type: 'string'},
   {name: 'userName', type: 'string'},
   {name: 'sex', type: 'string'},
   {name: 'operation', type: 'string'}
        ]
        })
    });
    store.load();

var _sm=new Ext.grid.RowSelectionModel({
singleSelect: true,
listeners: {
rowselect: function(sm, row, rec) {
//addform.form.loadRecord(rec);                   //也可以
record=rec;

}
}
});

   var querygrid = new Ext.grid.GridPanel({
    region:'center',
        tbar: [
            '快速搜索:',
            new Ext.ux.form.SearchField({
                store: store
            })
        ],
        enableColumnHide:false,
        border: true,
        autoExpandColumn: 'operation',
        cm: colModel,
        sm: _sm,
height:'328',
        loadMask:true,
        viewConfig:{
        forceFit:true,
        emptyText:'没有数据'
        },
        store: store,
        autoScroll:true,
        columnLines: true,
layout:'fit',
        bbar: new Ext.PagingToolbar({
            pageSize: 12,
            store: store,
            displayInfo: true,
            displayMsg: '第{0} - {1}条，共：{2}',
            emptyMsg: "无显示记录"
        })
    });
querygrid.render('productGridDiv');

var dsCompanyUnStore = new Ext.data.SimpleStore({
fields:['value','text'],
data: mydata
})

var dsCompanyStore = new Ext.data.SimpleStore({
fields:['value','text'],
data:mydata
})

isCompanyForm = new Ext.form.FormPanel({
region:'center',
    height:415,
width:600,
layout: 'fit',
    items:[{
        xtype: 'itemselector',
        name: 'itemselector',
        imagePath: '../../extjs/ux/images/',
        multiselects: [{
            height:350,
width:280,
            store: dsCompanyUnStore,
            displayField: 'text',
            valueField: 'value'
        },{
        id:'toComMultiselectsId',
            height:350,
width:280,
           store: dsCompanyStore,
            displayField: 'text',
            valueField: 'value'
        }]
    }],

    buttons: [{
        text: '保存',
        handler: function(){

        }
    }]
});

}

//弹出window,window中方一个FormPanel
var win;
function create(str){
if(!win){
        win = new Ext.Window({
applyTo:'addPanel',
            width:600,
            height:300,
            closeAction:'hide', //如果不加，关闭后，就不能打开
            modal:true,          //背景阴影
//            listeners: {
//                        hide:function(w){
//                            //关键部分：隐藏窗口前先还原,滚动条才不会消失
//                            addform.getForm().reset();
//                        }
//                    } ,
            layout: 'fit',
    items: addform
        });
    }

addform.form.reset();

if(str=="update")
    {
    Ext.getCmp('formaddform').setTitle("修改"+objbusinesstypetext);

    }else
    {
    Ext.getCmp('formaddform').setTitle("创建"+objbusinesstypetext);
    }

    win.alignTo(document.body , 'c-c?' );
    win.show();
}

var winassign;
function createwinassign(str,val){

temPanel.add(isCompanyForm);

if(!winassign){
        winassign = new Ext.Window({
            applyTo:'assignPanel',
            title: '分配权限组',
            height:415,
width:600,
resizable :false,
            closeAction:'hide', //如果不加，关闭后，就不能打开
            modal:true,          //背景阴影
            layout: 'fit',
    items: temPanel,
listeners: {
                        hide:function(w){
                            //关键部分：隐藏窗口前先还原,滚动条才不会消失
                           w.restore();
                        },
                        close:function(w){
                            //关键部分：关闭窗口前先还原,滚动条才不会消失
                            w.restore();
                        },
                        maximize:function(w){
                            //关键部分：最大化后需要将窗口重新定位，否则窗口会从最顶端开始最大化
                            w.setHeight(Ext.getBody().getViewSize().height);
                        }
                    }

        });
    }else
{
winassign.add(temPanel);
winassign.doLayout();
}

    winassign.alignTo(document.body , 'c-c?' );
    winassign.show();
}

var winassignCompany;
function createwinassignCompany(str,val){

temPanel.add(isCompanyForm);

if(!winassignCompany){
        winassignCompany = new Ext.Window({
            applyTo:'assignCompanyPanel',
            title: '分配公司',
            height:415,
width:600,
resizable :false,
            closeAction:'hide', //如果不加，关闭后，就不能打开
            modal:true,          //背景阴影
            layout: 'fit',
    items: temPanel,
listeners: {
                        hide:function(w){
                            //关键部分：隐藏窗口前先还原,滚动条才不会消失
                           w.restore();
                        },
                        close:function(w){
                            //关键部分：关闭窗口前先还原,滚动条才不会消失
                           w.restore();

                        },
                        maximize:function(w){
                            //关键部分：最大化后需要将窗口重新定位，否则窗口会从最顶端开始最大化
                            w.setHeight(Ext.getBody().getViewSize().height);
                        }
                    }
        });
    }else
{
winassignCompany.add(temPanel);
winassignCompany.doLayout();
}

    winassignCompany.alignTo(document.body , 'c-c?' );
    winassignCompany.show();
}

function renderLocation(value, cellmeta, record, rowIndex, columnIndex, store) {
var str = " ";
str=str+"  <input type='button' value='修改' onclick=\"create('update');\"/>";
str=str+"  <input type='button' value='分配权限组' onclick=\"createwinassign();\"/>";
str=str+"  <input type='button' value='分配公司' onclick=\"createwinassignCompany();\"/>";
return str;
}

分享到：