说明
关于后台代码只贴出Controller部分与pojo部分
完整代码参见:https://gitee.com/laolang2016/extstudy
目录结构
后台代码
domain
BaseDomain:
1 package com.laolang.ext.mvcone.domain; 2 3 import com.fasterxml.jackson.annotation.JsonFormat; 4 5 import java.util.Date; 6 7 /** 8 * 实体类基类 9 * @author laolang2016 10 * @version 1.0 11 */ 12 public class BaseDomain { 13 14 /** 15 * 创建时间 16 */ 17 @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") 18 protected Date created; 19 20 /** 21 * 最后更新时间 22 */ 23 @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") 24 protected Date updated; 25 26 public Date getCreated() { 27 return created; 28 } 29 public void setCreated(Date created) { 30 this.created = created; 31 } 32 public Date getUpdated() { 33 return updated; 34 } 35 public void setUpdated(Date updated) { 36 this.updated = updated; 37 } 38 39 40 41 }
User:
1 package com.laolang.ext.mvcone.domain; 2 3 import com.fasterxml.jackson.annotation.JsonFormat; 4 import org.springframework.format.annotation.DateTimeFormat; 5 6 import java.util.Date; 7 8 import javax.persistence.*; 9 /** 10 * 用户实体类 11 * @author laolang2016 12 * @version 1.0 13 */ 14 @Table(name = "tb_user") 15 public class User extends BaseDomain { 16 17 18 public User() { 19 } 20 21 @Override 22 public String toString() { 23 return "User{" + 24 "id=" + id + 25 ", nickName='" + nickName + '\'' + 26 ", pwd='" + pwd + '\'' + 27 ", sex=" + sex + 28 ", email='" + email + '\'' + 29 ", phone='" + phone + '\'' + 30 ", joinTime=" + joinTime + 31 ", birthday=" + birthday + 32 '}'; 33 } 34 35 public Integer getId() { 36 return id; 37 } 38 39 public void setId(Integer id) { 40 this.id = id; 41 } 42 43 public String getNickName() { 44 return nickName; 45 } 46 47 public void setNickName(String nickName) { 48 this.nickName = nickName; 49 } 50 51 public String getPwd() { 52 return pwd; 53 } 54 55 public void setPwd(String pwd) { 56 this.pwd = pwd; 57 } 58 59 public boolean isSex() { 60 return sex; 61 } 62 63 public void setSex(boolean sex) { 64 this.sex = sex; 65 } 66 67 public String getEmail() { 68 return email; 69 } 70 71 public void setEmail(String email) { 72 this.email = email; 73 } 74 75 public String getPhone() { 76 return phone; 77 } 78 79 public void setPhone(String phone) { 80 this.phone = phone; 81 } 82 83 public Date getJoinTime() { 84 return joinTime; 85 } 86 87 public void setJoinTime(Date joinTime) { 88 this.joinTime = joinTime; 89 } 90 91 public Date getBirthday() { 92 return birthday; 93 } 94 95 public void setBirthday(Date birthday) { 96 this.birthday = birthday; 97 } 98 99 /** 100 * ID 101 */ 102 @Id 103 @GeneratedValue(strategy = GenerationType.IDENTITY) 104 private Integer id; 105 106 @Column(name = "nick_name") 107 private String nickName; 108 109 private String pwd; 110 111 private boolean sex; 112 113 private String email; 114 115 private String phone; 116 117 @Column(name = "join_time") 118 @JsonFormat(pattern = "yyyy-MM-dd") 119 private Date joinTime; 120 121 @DateTimeFormat(pattern = "yyyy-MM-dd") 122 @JsonFormat(pattern = "yyyy-MM-dd") 123 private Date birthday; 124 125 }
pojo
Tip:
1 package com.laolang.ext.mvcone.pojo; 2 3 /** 4 * Created by Administrator on 2017/11/22. 5 */ 6 public class Tip { 7 8 public Tip() { 9 } 10 11 public boolean isSuccess() { 12 return success; 13 } 14 15 public void setSuccess(boolean success) { 16 this.success = success; 17 } 18 19 public String getMsg() { 20 return msg; 21 } 22 23 public void setMsg(String msg) { 24 this.msg = msg; 25 } 26 27 private boolean success; 28 29 private String msg; 30 }
UserListExtPojo
1 package com.laolang.ext.mvcone.pojo; 2 3 4 import com.laolang.ext.mvcone.domain.User; 5 6 import java.util.List; 7 8 public class UserListExtPojo { 9 10 public UserListExtPojo() { 11 } 12 13 public Long getTotal() { 14 return total; 15 } 16 17 public void setTotal(Long total) { 18 this.total = total; 19 } 20 21 public List<User> getData() { 22 return data; 23 } 24 25 public void setData(List<User> data) { 26 this.data = data; 27 } 28 29 private Long total; 30 31 private List<User> data; 32 }
controller
1 package com.laolang.ext.mvcone.web; 2 3 import com.github.pagehelper.PageInfo; 4 import com.laolang.ext.mvcone.domain.User; 5 import com.laolang.ext.mvcone.pojo.Tip; 6 import com.laolang.ext.mvcone.pojo.UserListExtPojo; 7 import com.laolang.ext.mvcone.service.UserService; 8 import com.laolang.ext.mvcone.util.StringUtils; 9 import org.springframework.beans.factory.annotation.Autowired; 10 import org.springframework.http.HttpStatus; 11 import org.springframework.http.ResponseEntity; 12 import org.springframework.stereotype.Controller; 13 import org.springframework.web.bind.annotation.RequestMapping; 14 import org.springframework.web.bind.annotation.RequestMethod; 15 import org.springframework.web.bind.annotation.RequestParam; 16 17 import java.util.List; 18 19 @RequestMapping("user") 20 @Controller 21 public class UserController { 22 23 @Autowired 24 private UserService userService; 25 26 @RequestMapping(value = "list",method = RequestMethod.GET) 27 public ResponseEntity<UserListExtPojo> list(@RequestParam(name = "page", defaultValue = "1") Integer page, @RequestParam(name = "limit", defaultValue = "10") Integer size) { 28 try{ 29 PageInfo<User> pageInfo = userService.findPageListByWhere(page,size,null); 30 UserListExtPojo users = new UserListExtPojo(); 31 users.setTotal(pageInfo.getTotal()); 32 users.setData(pageInfo.getList()); 33 34 return ResponseEntity.ok(users); 35 }catch (Exception e){ 36 37 } 38 return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null); 39 } 40 41 @RequestMapping(value = "delete/ids",method = RequestMethod.POST) 42 public ResponseEntity<Tip> deleteByIds( @RequestParam(name = "ids") String ids ){ 43 Tip tip = new Tip(); 44 try{ 45 userService.deleteByIds(User.class,"id", StringUtils.idsToList(ids)); 46 tip.setSuccess(true); 47 tip.setMsg("删除成功!"); 48 return ResponseEntity.ok(tip); 49 }catch (Exception e){ 50 51 } 52 tip.setSuccess(false); 53 tip.setMsg("删除失败!"); 54 return ResponseEntity.ok(tip); 55 } 56 57 @RequestMapping(value = "save",method = RequestMethod.POST) 58 public ResponseEntity<Tip> save( User user){ 59 Tip tip = new Tip(); 60 try{ 61 userService.save(user); 62 tip.setSuccess(true); 63 tip.setMsg("保存成功!"); 64 return ResponseEntity.ok(tip); 65 }catch (Exception e){ 66 67 } 68 tip.setSuccess(false); 69 tip.setMsg("保存失败!"); 70 return ResponseEntity.ok(tip); 71 } 72 73 @RequestMapping(value = "update",method = RequestMethod.POST) 74 public ResponseEntity<Tip> update( User user ){ 75 Tip tip = new Tip(); 76 try{ 77 userService.updateByPrimaryKeySelective(user); 78 tip.setSuccess(true); 79 tip.setMsg("修改成功!"); 80 return ResponseEntity.ok(tip); 81 }catch (Exception e){ 82 83 } 84 tip.setSuccess(false); 85 tip.setMsg("修改失败!"); 86 return ResponseEntity.ok(tip); 87 } 88 }
extjs代码
index.html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>ext hello</title> 6 7 <!-- extjs css--> 8 <link href="/assets/extjs-4.1.1/resources/css/ext-all.css" type="text/css" rel="stylesheet" /> 9 </head> 10 <body> 11 12 13 14 <script type="text/javascript" src="/assets/extjs-4.1.1/bootstrap.js"></script> 15 <script type="text/javascript" src="/assets/extjs-4.1.1/locale/ext-lang-zh_CN.js"></script> 16 17 <script type="text/javascript" src="/app/app.js"></script> 18 <script type="text/javascript" src="/assets/js/lib.js"></script> 19 20 </body> 21 </html>
lib.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 var KM = { 5 timeType : { 6 DATE : 'date', 7 DATETIME : 'datetime' 8 }, 9 /** 10 * 转换时间戳 11 * @param time 12 * @param type 13 * @returns {string} 14 */ 15 converDate : function(time,type) { 16 if ( type == KM.timeType.DATE ){ 17 return Ext.util.Format.date(time,'Y-m-d'); 18 } 19 if( type == KM.timeType.DATETIME ){ 20 return Ext.util.Format.date(time,'Y-m-d H:m:s'); 21 } 22 }, 23 /** 24 * 性别转换 25 * @param sex 26 * @returns {string} 27 */ 28 convertSex : function( sex ){ 29 if( sex ){ 30 return '男'; 31 }else{ 32 return '女'; 33 } 34 }, 35 url:{ 36 user:{ 37 list:'http://www.extmvcone.com/user/list', 38 deleteByIds:'http://www.extmvcone.com/user/delete/ids', 39 save : 'http://www.extmvcone.com/user/save', 40 update : 'http://www.extmvcone.com/user/update' 41 } 42 } 43 };
app.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.onReady(function () { 5 Ext.QuickTips.init(); 6 Ext.Loader.setConfig({ 7 enabled : true 8 }); 9 10 Ext.application({ 11 name : 'KM', 12 appFolder : 'app', 13 launch : function(){ 14 //Ext.MessageBox.alert('hello','hello world!'); 15 Ext.create('Ext.container.Viewport',{ 16 layout : "fit", 17 border : 0, 18 items : [{ 19 xtype : "mainviewLayout" 20 }] 21 }); 22 }, 23 controllers : [ 24 'KM.controller.MainController' 25 ] 26 }); 27 });
MainViewLayout.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.view.MainViewLayout',{ 5 extend : 'Ext.panel.Panel', 6 layout : 'border', 7 alias : 'widget.mainviewLayout', 8 items : [{ 9 region : 'north', 10 xtype : 'topview' 11 },{ 12 region : 'west', 13 xtype : 'leftview' 14 },{ 15 xtype : 'panel', 16 region : 'center', 17 layout : 'fit', 18 items : [{ 19 xtype : 'centerview', 20 border : 0 21 }] 22 }], 23 initComponent : function(){ 24 this.callParent(arguments); 25 } 26 });
TopView.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.view.TopView',{ 5 extend : 'Ext.panel.Panel', 6 alias : 'widget.topview', 7 id : 'topview', 8 height : 50, 9 html : 'topview' 10 });
LeftView.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.view.LeftView',{ 5 extend : 'Ext.panel.Panel', 6 alias : 'widget.leftview', 7 id : 'leftview', 8 collapsible: true, 9 split: true, 10 width : 180, 11 minWidth: 100, 12 title:"功能模块导航", 13 layout : 'accordion', 14 layoutConfig :{ 15 titleCollapse: false, 16 animate: true, 17 activeOnTop: true 18 }, 19 items:[{ 20 title:"用户管理", 21 items:[{ 22 xtype:"treepanel", 23 rootVisible : false,// 不展示根节点 24 displayField : "text", 25 border:0, 26 root: { 27 expanded: true, 28 children: [{ 29 id:"lvUserManage", 30 text: "用户管理", 31 leaf: true 32 }] 33 } 34 }] 35 },{ 36 title:"系统设置", 37 html: "权限管理" 38 }], 39 initComponent: function(){ 40 this.callParent(arguments); 41 } 42 });
CenterView.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define("KM.view.CenterView",{ 5 extend: 'Ext.tab.Panel', 6 alias : 'widget.centerview', 7 id:'centerview', 8 //margins: '2 0 0 0', 9 border : 0, 10 bodyStyle: 'padding:0px', 11 menuAlign:"center", 12 items:[{ 13 title:'首页', 14 // iconCls:'home', 15 bodyPadding :5, 16 layout:'fit', 17 items:{ 18 //xtype:'taskjobgrid' 19 }, 20 tabConfig : {//标签配置参数 21 22 } 23 }], 24 initComponent:function(){ 25 this.callParent(arguments); 26 } 27 });
MainController.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.controller.MainController',{ 5 extend : 'Ext.app.Controller', 6 init : function(){ 7 var me = this; 8 me.control({ 9 'leftview treepanel':{ 10 itemclick : function( tree, record,item,index, e, eOpts){ 11 var centerView = tree.up('mainviewLayout').down('centerview'); 12 if(record.data['id']=='lvUserManage'){ 13 14 addTab(me,{ 15 parentView : centerView, 16 viewXtype : 'userlayout', 17 controller : 'KM.controller.UserController', 18 viewName : 'KM.view.user.UserLayout' 19 }); 20 } 21 } 22 } 23 }); 24 25 }, 26 views : [ 27 'KM.view.LeftView', 28 'KM.view.MainViewLayout', 29 'KM.view.TopView', 30 'KM.view.CenterView' 31 ], 32 stores : [], 33 models : [] 34 }); 35 36 /** 37 * 38 * @param controller 39 * @param tabConfig 40 * { 41 * parentView : 父级view 42 * viewXtype : 要添加的view的alias 43 * controller : 要添加的view对应的controller 44 * viewName : 要添加的view的全名 45 * } 46 */ 47 function addTab( controller , tabConfig){ 48 if( tabConfig){ 49 var parentView = tabConfig.parentView; 50 var tab = parentView.down(tabConfig.viewXtype); 51 if( !tab ){ 52 controller.application.getController(tabConfig.controller).init(); 53 tab = Ext.create(tabConfig.viewName); 54 parentView.add(tab); 55 parentView.setActiveTab(tab) 56 }else{ 57 parentView.setActiveTab(tab); 58 } 59 } 60 }
UserLayout.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.view.user.UserLayout',{ 5 extend : 'Ext.panel.Panel', 6 alias : 'widget.userlayout', 7 title : '用户管理', 8 layout : 'fit', 9 closable : true, 10 items : [{ 11 xtype : 'usergrid' 12 },{ 13 xtype : 'userform', 14 hidden : true 15 }] 16 });
UserGrid.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.view.user.UserGrid', { 5 extend: 'Ext.grid.Panel', 6 alias: 'widget.usergrid', 7 store: "KM.store.UserStore", 8 selModel: { 9 selType: "checkboxmodel" 10 }, 11 border: 0, 12 multiSelect: true, 13 frame: true, 14 enableKeyNav: true, //可以使用键盘控制上下 15 columnLines: true, //展示竖线 16 stripeRows: true, // 斑马线效果 17 tbar: [{ 18 xtype: 'button', 19 text: '新增用户', 20 id : 'userGridBtnAdd' 21 },{ 22 xtype: 'button', 23 text: '修改用户', 24 id : 'userGridBtnUpdate' 25 },{ 26 xtype: 'button', 27 text: '删除用户', 28 id : 'userGridBtnDel' 29 }], 30 bbar:{ 31 xtype:'pagingtoolbar', 32 store:'KM.store.UserStore', 33 dock:'bottom', 34 displayInfo:true 35 }, 36 columns : [{ 37 xtype : 'rownumberer' 38 },{ 39 text : '用户昵称', 40 dataIndex : 'nickName', 41 width : 130 42 },{ 43 text : '性别', 44 dataIndex : 'sex', 45 width : 50, 46 renderer : function( value ){ 47 return KM.convertSex(value); 48 } 49 },{ 50 text : '邮箱', 51 dataIndex : 'email', 52 width : 200 53 },{ 54 text : '手机号码', 55 dataIndex : 'phone', 56 width : 150 57 },{ 58 text : '加入日期', 59 dataIndex : 'joinTime', 60 width : 100, 61 renderer : function (value) { 62 return KM.converDate(value,KM.timeType.DATE); 63 } 64 },{ 65 text : '出生日期', 66 dataIndex : 'birthday', 67 width : 100, 68 renderer : function (value) { 69 return KM.converDate(value,KM.timeType.DATE); 70 } 71 },{ 72 text : 'created', 73 dataIndex : 'created', 74 width : 130, 75 renderer : function (value) { 76 return KM.converDate(value,KM.timeType.DATETIME); 77 } 78 },{ 79 text : 'updated', 80 dataIndex : 'updated', 81 width : 130, 82 renderer : function (value) { 83 return KM.converDate(value,KM.timeType.DATETIME); 84 } 85 }], 86 initComponent: function () { 87 this.callParent(arguments); 88 } 89 });
UserForm.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.view.user.UserForm',{ 5 extend:"Ext.form.Panel", 6 alias:"widget.userform", 7 layout : { 8 type : "table", 9 columns : 2 10 }, 11 align:"left", 12 defaults:{ 13 margin:"10 0 0 15", 14 selectOnFocus:true, 15 width:300, 16 msgTarget:"side" //提示信息现在的位置 17 }, 18 tbar:[{ 19 xtype:"button", 20 id : 'userFormBtnSave', 21 text:"保存" 22 },{ 23 xtype:"button", 24 id : 'userFormBtnCancel', 25 text:"返回" 26 }], 27 items:[{ 28 xtype:"textfield", 29 fieldLabel:"ID", 30 name:"id", 31 hidden:true 32 },{ 33 xtype:"textfield", 34 fieldLabel:"昵称", 35 name:"nickName", 36 allowBlank : false,//不允许为空 37 blankText : '用户名不能为空',//错误提示内容 38 readOnly:false 39 },{ 40 xtype:"textfield", 41 fieldLabel:"密码", 42 inputType : 'password', 43 name:"pwd", 44 allowBlank : false,//不允许为空 45 blankText : '密码不能为空',//错误提示内容 46 readOnly:false 47 },{ 48 xtype:"textfield", 49 fieldLabel:"手机号码", 50 name:"phone", 51 allowBlank : false,//不允许为空 52 blankText : '电话不能为空',//错误提示内容 53 readOnly:false 54 },{ 55 xtype:"datefield", 56 fieldLabel:"出生日期", 57 name:'birthday', 58 readOnly:false, 59 format : 'Y-m-d' 60 },{ 61 xtype:"radiogroup", 62 fieldLabel:"性别", 63 items : [{ 64 name : 'sex', 65 inputValue : true, 66 boxLabel : '男', 67 id : 'userFormRadioMale' 68 },{ 69 name : 'sex', 70 inputValue : false, 71 boxLabel : '女', 72 id : 'userFormRadioFemale' 73 }] 74 },{ 75 xtype:"textfield", 76 fieldLabel:"邮箱地址", 77 name:'email', 78 readOnly:false 79 }], 80 initComponent:function(){ 81 this.callParent(arguments); 82 } 83 });
User.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.model.User',{ 5 extend : 'Ext.data.Model', 6 fields:[{ 7 name : 'id', 8 type : 'int' 9 },{ 10 name : 'nickName', 11 type : 'string' 12 },{ 13 name : 'email', 14 type : 'string' 15 },{ 16 name : 'phone', 17 type : 'string' 18 },{ 19 name : 'birthday', 20 type : 'date' 21 },{ 22 name : 'sex', 23 type : 'bool' 24 },{ 25 name : 'joinTime', 26 type : 'date' 27 },{ 28 name : 'pwd', 29 type : 'string' 30 },{ 31 name : 'created', 32 type : 'date' 33 },{ 34 name : 'updated', 35 type : 'date' 36 }] 37 });
UserStore.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.store.UserStore',{ 5 extend : 'Ext.data.Store', 6 storeId : 'UserStore', 7 model : 'KM.model.User', 8 autoLoad : true, 9 pageSize : 10, 10 proxy : { 11 type : 'ajax', 12 url : KM.url.user.list, 13 reader : { 14 type : 'json', 15 root : 'data' 16 }, 17 writer : { 18 type : 'json' 19 } 20 } 21 });
UserController.js
1 /** 2 * Created by Administrator on 2017/11/22. 3 */ 4 Ext.define('KM.controller.UserController',{ 5 extend : 'Ext.app.Controller', 6 init : function() { 7 var me = this; 8 me.control({ 9 // userform cancel 10 'userform button[id=userFormBtnCancel]' : { 11 click : function(btn){ 12 var form = btn.up("userform"); 13 var grid = form.up("userlayout").down("usergrid"); 14 form.hide(); 15 grid.show(); 16 } 17 }, 18 // userform save 19 'userform button[id=userFormBtnSave]' : { 20 click : function (btn) { 21 //根据id值来做判断,如果id为null说明是做添加操作,否则就是做修改操作 22 23 //1获得form 24 var form = btn.up("userform"); 25 var grid = form.up("userlayout").down("usergrid"); 26 var id = form.getForm().findField("id").getValue(); 27 var url = ""; 28 if(id == "" || null == id){ 29 url = KM.url.user.save; 30 }else{ 31 url = KM.url.user.update; 32 } 33 //2.把数据保存到数据库中去 34 form.submit({ 35 clientValidation : true, 36 waitMsg : '正在进行处理,请稍后...', 37 url : url, 38 method : 'POST', 39 success : function(form, action) { 40 var resObj = Ext.decode(action.response.responseText); 41 if (resObj.success) { 42 form.reset(); 43 //3.把这条数据加到grid中 44 grid.getStore().load(); 45 Ext.Msg.alert("提示", resObj.msg); 46 } else { 47 Ext.Msg.alert("提示", resObj.msg); 48 } 49 }, 50 failure : function(form, action) { 51 Ext.Msg.alert("提示","请求处理失败!"); 52 } 53 }); 54 } 55 }, 56 // 添加用户 57 'usergrid button[id=userGridBtnAdd]' : { 58 click : function(btn){ 59 var form = btn.up("userlayout").down("userform"); 60 //清空数据 61 form.getForm().reset(); 62 grid = form.up("userlayout").down("usergrid"); 63 grid.hide(); 64 form.show(); 65 } 66 }, 67 // 修改用户 68 'usergrid button[id=userGridBtnUpdate]':{ 69 click : function(btn){ 70 Ext.Msg.alert("提示", "双击需要修改的记录进行修改!"); 71 72 } 73 }, 74 // 双击进入表单修改数据 75 'usergrid' : { 76 itemdblclick : function(_grid, record, item, index, e, eOpts) { 77 var form = _grid.up("userlayout").down("userform"); 78 var grid = form.up("userlayout").down("usergrid"); 79 //把选择的数据加载到form中去 80 var _record = grid.getSelectionModel().getSelection(); 81 form.loadRecord(_record[0]); 82 grid.hide(); 83 form.show(); 84 // 解决表单回显时性别赋值不正确的问题 85 var sex = record.get('sex'); 86 if( sex ){ 87 Ext.getCmp('userFormRadioMale').setValue(true); 88 }else{ 89 Ext.getCmp('userFormRadioFemale').setValue(true); 90 } 91 } 92 }, 93 // 删除用户 94 'usergrid button[id=userGridBtnDel]':{ 95 click : function(btn){ 96 console.log('删除用户'); 97 var grid = btn.up("usergrid"); 98 var store = grid.getStore(); 99 var records = grid.getSelectionModel().getSelection(); 100 if (!records || records.length <= 0) { 101 Ext.Msg.alert("提示", "请选择需要删除的数据!"); 102 return; 103 } 104 // 根据id删除多条记录 105 var data = []; 106 Ext.Array.each(records, function(model) { 107 data.push(Ext.JSON.encode(model.get('id'))); 108 }); 109 Ext.Ajax.request({ 110 waitMsg : '正在进行处理,请稍后...', 111 url : KM.url.user.deleteByIds, 112 params : { 113 ids : data.join(",") 114 },// 根据id删除 115 method : "POST", 116 //timeout : 4000, 117 success : function(response, opts) { 118 var resObj = Ext.decode(response.responseText); 119 if (resObj.success) { 120 // 不用查询,从grid中去掉对应的记录就OK了 121 store.load(); 122 Ext.Msg.alert("提示", resObj.msg); 123 } else { 124 Ext.Msg.alert("提示", resObj.msg); 125 } 126 } 127 }); 128 } 129 } 130 }); 131 }, 132 views : [ 133 'KM.view.user.UserLayout', 134 'KM.view.user.UserGrid', 135 'KM.view.user.UserForm' 136 ], 137 models : [ 138 'KM.model.User' 139 ], 140 stores : [ 141 'KM.store.UserStore' 142 ] 143 });
相关文件说明
- Tip.java用来输出提示信息
- UserLiseExtPojo.java输出Ext JS 中 Store所需要的json格式
- lib.js主要用来实现一些通用方法,比如日期格式化,以及保存需要用到的URL地址
注意事项
- form组件回显的时候,如果性别为男则可以正常显示,如果性别为女则无法显示,相应的解决方法是直接查询到radio组件再直接赋值
- JS文件名与JS类名要一致
- 输出的JSON数据,日期格式最好进行格式化,否则form组件回显的时候会出问题
- ----------------------------
- 本项目配置了nginx,如果你不想用相关配置,注意要把lib.js中的地址修改一下
运行效果