dategrid 创建，重写分页

最新推荐文章于 2018-05-04 14:28:43 发布

原创最新推荐文章于 2018-05-04 14:28:43 发布 · 218 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery easyui #dategrid动态查询 #分页重写

jquery easyui 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了学校管理中数据展示、动态查询及批量删除的操作方法，包括数据表格的配置、分页展示、条件筛选和批量删除功能实现。

	$('#dg').datagrid({   
			    url:'<%=request.getContextPath()%>/school/school_selectAllSchools.action',
			   // title:'学校管理',
			    //iconCls:'icon-edit',//图标
			     pagination:true,
			     //idField:'id',
			     frozenColumns:[[   //checkbox
            	{field:'ck',checkbox:true}   
       			 ]] 
			}); 
	//分页	
	   var p = $('#dg').datagrid('getPager');   
	    $(p).pagination({   
	        pageSize: 10,//每页显示的记录条数，默认为10   
	        pageList: [5,10,15],//可以设置每页记录条数的列表   
	        beforePageText: '第',//页数文本框前显示的汉字   
	        afterPageText: '页    共 {pages} 页',   
	        displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录' 
	    }); 
	});

 /**动态查询-传递参数给dategrid**/
 function searchSchool(){
  var name = $('#name').val();
  var masters =$('#masters').val();
   $('#dg').datagrid({
    queryParams: {
     name: name,
     masters: masters
    }
   });
   var p = $('#dg').datagrid('getPager');   
      $(p).pagination({   
          pageSize: 10,//每页显示的记录条数，默认为10   
          pageList: [5,10,15],//可以设置每页记录条数的列表   
          beforePageText: '第',//页数文本框前显示的汉字   
          afterPageText: '页    共 {pages} 页',   
          displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录' 
      }); 
 }

/**批量删除**/
function removeSchool(){
 var rows = $('#dg').datagrid("getSelections"); //获取你选择的所有行 
 /*
 //获取表格选择行
 alert(rows.length);
 for(var i =0;i<rows.length;i++){
  var ins = $('#dg').datagrid('getRowIndex',rows[i]);//获取某行的行号
  alert(ins+'-'+rows[i].id);
  $('#dg').datagrid('deleteRow',ins); //通过行号移除该行
 }
 */
 if(!rows || rows.length == 0){
  $.messager.alert('提示','请选择要删除的数据','info');
  return;
 }
 var parm;
 $.each(rows,function(i,n){
  if(i == 0){
   parm = 'ids=' +n.id;
  }else{
   parm +=',' +n.id;
  }
  alert(parm);
 });
 $.messager.confirm('提示','是否删除选中的数据?',function(r){
  if(!r){
   return;
  }
  //提交
  $.post('<%=request.getContextPath()%>/school/school_deleteAllSchools.action',parm,function(msg){
   if(msg.indexOf('success') != -1){
    $.messager.alert('提示','批量删除成功','info',function(){
     //重新加载当前页
     $('#dg').datagrid('reload');
    });
   }else{
    $.messager.alert('提示',msg.Message,'info');
   }
  });
 });
}

   <!-- 表格数据 -->
   <table id="dg" style="width:auto;height:350px"
      toolbar="#toolbar" rownumbers="true" 
      fitColumns="true" singleSelect="false">
     <thead>
      <tr>
       <th field="name" width="150">学校名称</th>
       <th field="masters" width="150">校长</th>
       <th field="net" width="150">学校网址</th>
       <th field="address" width="300">学校地址</th>
      </tr>
     </thead>
   </table>