easyui之grid又封装

easyui之grid再封装

    easyui之grid，相信如果用了easyui的，都会用到grid，但是总觉得每次都需要重复编写基本类似的JS代码，总觉得让人别扭，所以对其再封装，同时整合增加、编辑、删除、转移、分页、查询等功能函数，提高代码的通用性。

   闲话少说，贴上代码，如下：

// JavaScript Documentvar myDatagrid={    datagridId:"",  // datagrid table idqueryFormId:"", // search form idqueryAction:"", // search from actioninfoFormId:"",  // info form idinfoAddAction:"",  // info data add action infoUpdateAction:"", //info update actioninfoDlgDivId:"",  // info data detail/edit dlg div iddeleteAction:"",  //data delete action  from ajaxdeleteMsg:"",    // show the message before do deletemoveDlgDivId:"",  // the div id of dialog for move showmoveFormId:"",    //the form id for movemoveTreeId:"",    // the combotree id for movedataUrl:"",       //datagrid data load url from ajaxqueryParams:{},   //search params name for post, must to be {}queryParamsVCN:{}, //search params value from htmlcontrol name, must to be {}columns:[],   //datagrid columns ,must to be []addOrUpdateFlag:0,  //0-add ,1-updatebeforeAddFn:function(){ return true;},beforeDoAddFn:function(){ return true;},afterDoAddFn:function(){},beforeDeleteFn:function(){ return true;},afterDeleteFn:function(){},beforeDetailFn:function(){ return true;},afterDetailFn:function(){},beforeUpdateFn:function(){ return true;},beforeDoUpdateFn:function(){ return true;},afterUpdateFn:function(){},beforeMoveFn:function(){ return true;},beforeDoMoveFn:function(){ return true;},afterMoveFn:function(){},//datagrid default setloadMsg:'数据加载中,请稍后...', fitColumns:false,nowrap:true,    rownumbers:true,     pagination:true,pageSize:18,pageList:18,width:"auto",height:"auto",singleSelect:false,     idField:'id', fit:false,dBodyHeight:126,//需要减去的高度moveSelectedId:"moveSelectedId",moveParentId:"moveParentId",    init:function(){this.initBodyHeight();this.initDatagrid();this.initInfoDlg();this.initPagination();this.datagridReload();try{ this.initMoveDlg(); }catch(e){}  //因为转移功能不是一定需要，故使用try},initBodyHeight:function(){var bh=parent.document.body.clientHeight;    $("body").css("height",(bh-this.dBodyHeight)+"px");this.height=document.body.clientHeight;},initDatagrid:function(){$('#'+this.datagridId).datagrid({         //url:myDatagrid.parseAction(myDatagrid.dataUrl), //不在这里设置URL，是为了解决IE缓存的问题                loadMsg:this.loadMsg,                 width:this.width,                 height:this.height,  fitColumns:this.fitColumns,nowrap:this.nowrap,                rownumbers:this.rownumbers,                 pagination:this.pagination, pageSize:this.pageSize,pageList:[this.pageList],queryParams:this.queryParams,                singleSelect:this.singleSelect,                 idField:this.idField, fit:this.fit,                columns:[this.columns],});},datagridSelections:function(){return  $('#'+this.datagridId).datagrid('getSelections');},datagridSelected:function(){return  $('#'+this.datagridId).datagrid('getSelected');},clearSelections:function(){  $('#'+this.datagridId).datagrid("clearSelections");},unselectRow:function(index){  $('#'+this.datagridId).datagrid("unselectRow",index);},selectRecord:function(idv){   return $('#'+this.datagridId).datagrid("selectRecord",idv);},selectRow:function(index){   return $('#'+this.datagridId).datagrid("selectRow",index);},selectAll:function(){   return $('#'+this.datagridId).datagrid("selectAll");},datagridReload:function(){ $("#"+this.queryFormId).attr("action",this.parseAction(this.queryAction));$('#'+this.datagridId).datagrid('options').url=this.parseAction(this.dataUrl);var queryParams = $('#'+this.datagridId).datagrid('options').queryParams;for( var key in queryParams){  for(var _key  in  this.queryParamsVCN){if(key==_key){  queryParams[key]=encodeURIComponent($("#"+this.queryParamsVCN[_key]).val());}}}$('#'+this.datagridId).datagrid('reload');},    initPagination:function(){ var pager=$('#'+this.datagridId).datagrid('getPager')pager.pagination({onSelectPage:function(page,rows){myDatagridObj.datagridReload();}});},resize:function(_width,_height){    $('#'+this.datagridId).datagrid("resize",{width:_width});},doSearch:function(){this.datagridReload();},moveTreeReload:function(){$('#'+this.moveTreeId).combotree("reload");},getMoveTreeVal:function(){return  $('#'+this.moveTreeId).combotree('getValue');},getMoveSelectedIds:function(){return  $('#'+this.moveSelectedId).val();},getMoveParentId:function(){return  $('#'+this.moveParentId).val();},    initInfoDlg:function(){$('#'+this.infoFormId).css("display","block");        $('#'+this.infoDlgDivId).dialog({resizable:false,collapsible:true,modal:true,buttons:[{text:'确定',iconCls:'icon-ok',handler:function(){ if(myDatagridObj.addOrUpdateFlag==0)    myDatagridObj.doAdd();else if(myDatagridObj.addOrUpdateFlag==1)    myDatagridObj.doUpdate();}},{text:'关闭',iconCls:'icon-cancel',handler:function(){myDatagridObj.closeInfoDlg();}}]});},initMoveDlg:function(){$('#'+this.moveFormId).css("display","block");        $('#'+this.moveDlgDivId).dialog({resizable:false,collapsible:true,modal:true,buttons:[{text:'确定',iconCls:'icon-ok',handler:function(){myDatagridObj.doMove();}},{text:'关闭',iconCls:'icon-cancel',handler:function(){myDatagridObj.closeMoveDlg();}}]});$('#'+this.moveFormId).append("<input type='hidden' name='"+this.moveSelectedId+"'  id='"+this.moveSelectedId+"' />");$('#'+this.moveFormId).append("<input type='hidden' name='"+this.moveParentId+"'  id='"+this.moveParentId+"' />");},    showInfoDlg:function(){$('#'+this.infoDlgDivId).dialog("open");},closeInfoDlg:function(){$('#'+this.infoDlgDivId).dialog("close");},showMoveDlg:function(){    $('#'+this.moveDlgDivId).dialog("open");},closeMoveDlg:function(){    $('#'+this.moveDlgDivId).dialog("close");},toAdd:function(){this.addOrUpdateFlag=0;if(!this.beforeAddFn()) return;this.showInfoDlg();},toDetail:function(){if(!this.beforeDetailFn()) return;this.showInfoDlg();},toUpdate:function(){   this.addOrUpdateFlag=1;   var tmp =this.datagridSelected();   if(tmp==null){   $.messager.alert('系统提示','<br>请选择您要修改的记录。','info');   return;   }   if(!this.beforeUpdateFn()) return;   this.showInfoDlg();},toMove:function(){var tmp =this.datagridSelections(); if(tmp.length<=0){$.messager.alert('系统提示','<br>请选择您要转移的记录。','info');            return;}       if(!this.beforeMoveFn()) return;    this.showMoveDlg();},    doAdd:function(){$("#"+this.infoFormId).attr("action",this.parseAction(this.infoAddAction));$('#'+this.infoFormId).form('submit',{onSubmit: function(){      if(!myDatagridObj.beforeDoAddFn()) return;    return $(this).form('validate');            },   success:function(data){ if(data.Trim()=="success"){    //$.messager.alert('系统提示','<br>增加成功。','info');   myDatagridObj.closeInfoDlg();   myDatagridObj.datagridReload();   myDatagridObj.afterDoAddFn(); }else{   $.messager.alert('系统提示','<br>增加失败。','info');}}});},    doUpdate:function(){$("#"+this.infoFormId).attr("action",this.parseAction(this.infoUpdateAction));$('#'+this.infoFormId).form('submit',{onSubmit: function(){      if(!myDatagridObj.beforeDoUpdateFn()) return;    return $(this).form('validate');            },   success:function(data){ if(data.Trim()=="success"){    //$.messager.alert('系统提示','<br>修改成功。','info');   myDatagridObj.closeInfoDlg();   myDatagridObj.clearSelections();   myDatagridObj.datagridReload();   myDatagridObj.afterUpdateFn();}else{   $.messager.alert('系统提示','<br>修改失败。','info');}}});},    doDelete:function(){if(!this.beforeDeleteFn()) return;var tmp =this.datagridSelections();if(tmp.length<=0){$.messager.alert('系统提示','<br>请选择您要删除的记录。','info');            return;}    $.messager.confirm('系统提示', '<br>真的需要删除这些数据吗?<br>'+ this.deleteMsg, function(r){if (r){var ids="";for(var i=0;i<tmp.length;i++){   if(ids=="")       ids=(tmp[i]).id;   else       ids+=","+(tmp[i]).id;}//alert(tmp+"--"+tmp.length+"--"+ids);                $.ajax({type: "POST",data:{"ids":ids},url:myDatagridObj.parseAction(myDatagridObj.deleteAction), success:function(data){if(data.Trim()=="success"){    //$.messager.alert('系统提示','<br>删除成功。','info');    myDatagridObj.clearSelections();   myDatagridObj.datagridReload();   myDatagridObj.afterDeleteFn();}else{   $.messager.alert('系统提示','<br>删除失败。','info');}}                 });}});},doMove:function(){        var s="sdf";$('#'+this.moveFormId).form('submit',{onSubmit: function(){      var val =  myDatagridObj.getMoveTreeVal(); if(val==""){$.messager.alert('系统提示','<br>请选择需要转向的父类。','info');return false;}var tmp=myDatagridObj.datagridSelections();    var ids="";    for(var i=0;i<tmp.length;i++){   if( ((tmp[i]).id)!=val){      if(ids=="")     ids=(tmp[i]).id;      else     ids+=","+(tmp[i]).id;   }    }    $("#"+myDatagridObj.moveSelectedId).val(ids);$("#"+myDatagridObj.moveParentId).val(val);if(!myDatagridObj.beforeDoMoveFn()) return;    return $(this).form('validate');            },   success:function(data){ if(data.Trim()=="success"){    //$.messager.alert('系统提示','<br>转移成功。','info');   myDatagridObj.clearSelections();   myDatagridObj.closeMoveDlg();   myDatagridObj.datagridReload();   myDatagridObj.moveTreeReload();   myDatagridObj.afterMoveFn();  }else{   $.messager.alert('系统提示','<br>转移失败。','info');}}});},    parseAction:function(action){if(action.indexOf('?')>=0)  return action+="&xxtime="+(new Date().getTime());else  return action+="?xxtime="+(new Date().getTime());}};