EasyUI datagrid问题整理

什么是easyUIeasyui是一种基于jQuery、Angular.、Vue和React的用户界面插件集合。easyui为创建现代化，互动，JavaScript应用程序，提供必要的功能。使用easyui你不需要写很多代码，你只需要通过编写一些简单HTML标记，就可以定义用户界面。easyui是个完美支持HTML5网页的完整框架。easyui节省您网页开发的时间和规模。easyui很简单但功能强大的。使用背景由于项目需要，主要利用easyUI的数据表格datagrid做后台系统前端部分使用EasyUI for JQuery使用js创建数据网格<table id=“dg”></table>$(’#dg’).datagrid({ url:‘datagrid_data.json’, columns:[[ {field:‘code’,title:‘Code’,width:100}, {field:’name’,title:‘Name’,width:100}, {field:‘price’,title:‘Price’,width:100,align:‘right’} ]]});通过一些参数查询数据$(’#dg’).datagrid(’load’, { name: ’easyui’, address: ‘ho’});在向服务器改变数据后，更新前台数据$(’#dg’).datagrid(‘reload’); 官方文档路径官方网址：http://www.jeasyui.net/下载路径：http://www.jeasyui.net/download官方中文文档：http://www.jeasyui.net/pluginsdatagrid数据网格详细介绍：http://www.jeasyui.net/plugin…遇到的问题1.初次不加载数据需求：页面首次加载，datagrid不加载页面数据，点击查询按钮再进行数据渲染//onBeforeLoad发送加载数据的请求前触发，如果返回 false 加载动作就会取消。//首次不加载页面数据onBeforeLoad: function (param) { var firstLoad = $(this).attr(“firstLoad”); if (firstLoad == “false” || typeof (firstLoad) == “undefined”) { $(this).attr(“firstLoad”,“true”); return false; } return true;}2.请求参数，服务器响应415无法修改content-Type可以改用loader自定义获取数据loader：定义如何从远程服务器加载数据。返回 false 则取消该动作。该函数有下列参数：param：要传递到远程服务器的参数对象。success(data)：当检索数据成功时调用的回调函数。error()：当检索数据失败时调用的回调函数。 loader: function (param, success, error) { //console.log(param, success, error); $.ajax({ type: “POST”, url : ‘请求接口’, contentType: “application/json”, dataType: “json”, data: JSON.stringify(param)//数据转换成JSON格式 }).done(function (data) { if (data.total!=0) { success(data); } else { $.messager.alert(’’); error(); } }).fail(function () { }); },3.分页总页数，总条数设置问题后台返回json数据格式{total:总共有多少条数据，rows:[{,},{,}]//请求页数的结果数据}4.修改datagrid默认请求参数名称//重新制定请求参数名称onBeforeLoad : function(param){ var page = param.page; //保存下默认请求参数page值 delete param.page; //删掉默认请求参数page param.PageIndex = page; //将默认请求参数名称page换为PageIndex}