employeeupdate.js

基于Spring、Struts2、TopLink框架及ExtJs框架设计的一个简单Web开发应用框架

function removeEmployee(empid) {
	Ext.MessageBox.confirm('', '确认删除吗？', function(btn) {
		if(btn == 'yes') {
			Ext.Ajax.request({
			url:'remove.action?empid=' + empid,		
			success:function() {
				Ext.StoreMgr.get('stores').load();
			}
		});
		}
	})
}

var ds = new Ext.data.JsonStore({
            autoLoad: true,
            url:'view.action',
            storeId:'stores',
            root:'results',
            fields:['id', 'empid', 'empno', 'firstname', 'lastname', 'job', 'education', 'sex', {name:'salary', type:'float'},
                  'birthday', 'num', 'stname']
        });
        
Ext.onReady(function(){
    new Ext.grid.GridPanel({
        store:ds,
        columns:[            
               {header:'员工号', dataIndex:'empno'},
               {header:'名', dataIndex:'firstname'},
               {header:'姓', dataIndex:'lastname'},
               {header:'工作', dataIndex:'job'},
               {header:'教育', dataIndex:'education'},
               {header:'性别', dataIndex:'sex'},
               {header:'薪水', dataIndex:'salary', renderer:Ext.util.Format.usMoney},
               {header:'生日', dataIndex:'birthday', width:210},
               {header:'地址号码', dataIndex:'num'},
               {header:'地址名称', dataIndex:'stname', width:150},
               {width:55, renderer:function(value, metadate, record) {
               	 return '<a href="#" onclick="removeEmployee(' + record.get('empid') + ')">删除</a>';               	
               }}],
        width:850,
        height:400,
        frame:true,
        title:'查看所有雇员',
        sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
        
        bbar: new Ext.PagingToolbar({
		            pageSize: 3,
		            store: ds,
		            displayInfo: true,
		            displayMsg: '当前显示 {0} - {1}条记录 /共 {2}条记录',
		            emptyMsg: "当前无记录可显示。"
		        }),
        viewConfig: {
            forceFit: true
        },
        listeners:{
        	rowdblclick:function(grid, index, e){
        		var record = grid.getSelectionModel().getSelected();
        		Ext.getDom('win').innerHTML = '';
        		var win = new Ext.Window({
					el:'win',
	                layout:'fit',
	                width:350,
	                autoHeight:true,
	                modal:true,
	                closeAction:'hide',
	                plain:true,
	                items:[{
	                	frame:true,
	                    id:'panel',                                     
	                    title:'修改雇员',
	                    autoHeight:true,
	                    xtype:'form',                                    
	                    defaults:{
	                        bodyStyle:'padding:15px'
	                    },
	                    width:400,
	                    bodyStyle:'padding:15px',
	                    items:[{
	                    	fieldLabel:'员工号',
	                        labelWidth:65,
	                        name:'empno',
	                        maxLength:5,
	                        value:record.get('empno'),
	                        xtype:'textfield',
	                        id:'empno'
	                    },{
		                    fieldLabel:'名',
		                    name:'firstName',
		                    value:record.get('firstname'),
		                    xtype:'textfield',
		                    id:'firstName'
		                },{
		                    fieldLabel:'姓',
		                    name:'lastName',
		                    value:record.get('lastname'),
		                    xtype:'textfield',
		                    id:'lastName'
		                },{
		                    fieldLabel:'工作',
		                    name:'job',
		                    xtype:'textfield',
		                    value:record.get('job'),
		                    id:'job'
		                },{
		                    fieldLabel:'教育',
		                    name:'education',
		                    value:record.get('education'),
		                    xtype:'textfield',
		                    id:'education'
		                },{
		                    fieldLabel:'性别',
		                    name:'sex',
		                    xtype:'textfield',
		                    value:record.get('sex'),
		                    maxLength:1,
		                    id:'sx'
		                },{
		                    fieldLabel:'薪水',
		                    name:'salary',            
		                    xtype:'numberfield',
		                    value:record.get('salary'),
		                    id:'salary'
		                },{
		                    fieldLabel:'地址号',
		                    name:'addr.number',
		                    xtype:'numberfield',
		                    value:record.get('num'),
		                    id:'addr.number'
		                },{
		                    fieldLabel:'地址名称',
		                    name:'addr.street',
		                    xtype:'textfield',
	                        value:record.get('stname'),
		                    id:'addr.street'
		                },{
		                    fieldLabel:'生日',
		                    xtype:'datefield',
		                    name:'birthday',
		                    id:'birthday',
	                        value:record.get('birthday')
		                }],
		                buttons:[{
	                        text:'提交',
	                        handler:function(){
	                            Ext.getCmp('panel').getForm().submit({
	                                url:'update.action?empid=' + record.get('empid') + '&id=' + record.get('id'),
	                                method:'POST',                                                                  
	                                success:function(form, action) {
	                                    win.hide();
	                                    ds.load();
	                                }
	                            });
	                        }
	                    }]
                    }]
			    });
			    win.show(this);
        	}
        },
        renderTo:Ext.getBody()
    });
    
    ds.load({params:{start:0, limit:3}});
});