本文共 6943 字，大约阅读时间需要 23 分钟。
项目用到handsontable 插件
根据官网 API写的handsontable初始化, 数据展示, ajax请求, 参数封装, Controller参数接受全局容器
var AllData = {};var updatelist = [];var delidslist =[];var insertlist=[]; handsontable 的初始化
function onIniHandsonTable(data) {
KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲hot').empty(); …/ } ], stretchH: ‘all’, autoWrapRow: true, rowHeaders: true, colHeaders : [ ‘ID’, ’ ERSystem ', ’ ConcurSystem ',‘APISystem’,‘MyEven’,‘ExpressSum’,‘TodayDate’,‘EndDate’,‘DelayDay’ ], columnSorting: true, contextMenu:true, sortIndicator: true, dropdownMenu: [‘filter_by_condition’, ‘filter_by_value’,‘filter_action_bar’], //dropdownMenu:true, filters: true, renderAllRows: true, search: true,afterDestroy (){ // 移除事件 Handsontable.Dom.removeEvent(save, 'click', saveData); loadDataTable(); }, beforeRemoveRow:function(index,amount){ var ids = []; //封装id成array传入后台 if(amount!=0){ for(var i = index;i 删除list封装([ id1,id2,…])
//删除的优先级最高
function delExpressCount (ids){ //传入的ids.length不可能为0 $.each(ids,function(index,id){ if(id!=null){ delidslist.push(id); } }); AllData.delidslist=delidslist; }删除的优先级别大于更新,如果一条数据被更新了又被删除了,事实上不需要执行更新操作的
//updatelist数据更新function screening(){ if(updatelist.length!=0&&delidslist.lentgh!=0){ for(var i=0;i 更新list封装([{expresscount1},…])
//更新数据
function updateExpressCount(data){ if(JSON.stringify(data) != “{}”){ var flag = true; //判断记录是否存在,更新数据 $.each(updatelist,function(index,node){ if(node.id==data.id){ //此记录已经有了 flag = false; //用新得到的记录替换原来的,不用新增 updatelist[index] = data; } }); flag&&updatelist.push(data); //封装 AllData.updatelist=updatelist; } }清空全局容器
clearContainer =function (){
AllData = {}; updatelist = []; delidslist =[]; insertlist=[]; }//获得当前时间
function getNowFormatDate() { var date = new Date(); var seperator1 = “-”; var seperator2 = “:”; var month = date.getMonth() + 1; var strDate = date.getDate(); if (month >= 1 && month <= 9) { month = “0” + month; } if (strDate >= 0 && strDate <= 9) { strDate = “0” + strDate; } var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + " " + date.getHours() + seperator2 + date.getMinutes() + seperator2 + date.getSeconds(); return currentdate; }加载用户数据，并绑定到handsontable
function loadDataTable(){ showWait(); $.ajax({ url:'fillList', type:'post', dataType:'json', success:function(rdata){ closeWait(); var convertData = []; if (rdata && typeof rdata === "object") { //重新封装数据,因为时间类型不符合要求 $.each(rdata,function(index,node){ convertData.push({ id:node.id, myeven:node.myeven, expresssum:node.expresssum, ersystem:node.ersystem, concursystem:node.concursystem, apisystem :node.apisystem, todaydate :common.timestampToDate(node.todaydate), enddate:common.timestampToDate(node.enddate), delayday:node.delayday }); }); onIniHandsonTable(convertData); } else{ $.alert({ title: '消息提示', type: 'red', content: '加载数据失败.', }); } }, error:function(e,j,t){ closeWait(); $.alert({ title: '错误提示', type: 'red', content: '加载数据错误.', }); console.log('express count/fill error:'+j+','+t); } });} 对应的pojo类
public class ExpressCount {
private Integer id;private Integer ersystem;private Integer concursystem;private Integer apisystem;private Integer myeven;private Integer expresssum;private Date todaydate;private Date enddate;private Integer delayday;private Date createdate;private Integer createuserid;private String createusername;public Integer getId() { return id;}public void setId(Integer id) { this.id = id;}public Integer getErsystem() { return ersystem;}public void setErsystem(Integer ersystem) { this.ersystem = ersystem;}public Integer getConcursystem() { return concursystem;}public void setConcursystem(Integer concursystem) { this.concursystem = concursystem;}public Integer getApisystem() { return apisystem;}public void setApisystem(Integer apisystem) { this.apisystem = apisystem;}public Integer getMyeven() { return myeven;}public void setMyeven(Integer myeven) { this.myeven = myeven;}public Integer getExpresssum() { return expresssum;}public void setExpresssum(Integer expresssum) { this.expresssum = expresssum;}public Date getTodaydate() { return todaydate;}public void setTodaydate(Date todaydate) { this.todaydate = todaydate;}public Date getEnddate() { return enddate;}public void setEnddate(Date enddate) { this.enddate = enddate;}public Integer getDelayday() { return delayday;}public void setDelayday(Integer delayday) { this.delayday = delayday;}public Date getCreatedate() { return createdate;}public void setCreatedate(Date createdate) { this.createdate = createdate;}public Integer getCreateuserid() { return createuserid;}public void setCreateuserid(Integer createuserid) { this.createuserid = createuserid;}public String getCreateusername() { return createusername;}public void setCreateusername(String createusername) { this.createusername = createusername == null ? null : createusername.trim();} }
参数封装pojo类
public class ExpressCountDataList {
List updatelist; List insertlist; List delidslist;public ListgetUpdatelist() { return updatelist;}public void setUpdatelist(List updatelist) { this.updatelist = updatelist;}public List getInsertlist() { return insertlist;}public void setInsertlist(List insertlist) { this.insertlist = insertlist;}public List getDelidslist() { return delidslist;}public void setDelidslist(List delidslist) { this.delidslist = delidslist;}
}
Controller接收
/**
* 保存编辑后table数据 * @param AllData(删除,更新,插入) * @return */ @ResponseBody @RequestMapping("/globalprocess") public Page globalprocess(@RequestBody ExpressCountDataList AllData){ Page page = new Page();Listupdatelist =AllData.getUpdatelist(); List insertlist =AllData.getInsertlist(); List delidslist=AllData.getDelidslist(); //更新 boolean result = expressCountService.globalprocess(updatelist,insertlist,delidslist); if(result == true){ page.setErrorCode(0); page.setSuccess(true); page.setMessage("操作成功"); }else{ page.setErrorCode(0); page.setSuccess(true); page.setMessage("操作失败"); } return page;}
转载地址：http://gezxi.baihongyu.com/