easyUI datagrid一直不出数据

2017-11-21 05:08:34 2k 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

EasyUI之datagrid展示数据列表写在最前：如果你用惯了Web Mvc框架的视图跳转方式来开发后台系统，第一次接触到EasyUI的时候，往往会有一个大大的疑问，这EasyUI是如何做跳转的啊？增删改查都不知道如何下手了！但是当你知道有RestFul编程的时候。你会恍然大悟：我靠，RestFul+EasyUI简直就是绝配呀！博主就是如此：在写完一个增删改查之后，才发现EasyUI越学越有意思，页面都是靠局部刷新来动态展示数据，这... 阅读详情

如题，我感觉我的代码是正确的，可是一直不出数据。看了好多帖子，试了各种办法，都没用，我快要崩溃了。请各位帮帮忙
我的前台代码：
<div id="dd"></div>

$(function () {
$('#dd').datagrid({
title: "测试 ",
width: "auto",
striped: true,
singleSelect: true,
loadMsg: "正在加载，请稍等...",
url: '/test/GetGridData', //获取数据地址
pagination: true,
rownumbers: true,
pageList: [5, 10, 15, 20],
pageSize: 10,
idField: "id",
columns: [[
{ title: "测试1", field: "productid", width: "180", align: "center" },
{ title: "测试2", field: "productname", width: "300", align: "center" },
{ title: "测试3", field: "city", width: "300", align: "center" }
]]
});
});
后台代码：
public JsonResult GetGridData(int rows, int page)
{

//result为json数据格式测试
string result = "";
result += "{\"total\":" + (rows *page)+ " ";
result += "rows:{[ ";
for (int i = 0; i <= rows; i++)
{
result += "{\"productid\":编号" + i + ",\"productname\":姓名" + i + ",\"city\":城市" + i + "\"}";
}
result += "]}";

JsonResult js = Json(result, JsonRequestBehavior.AllowGet);
return js;
}

...全文

EasyUI DataGrid及Pagination DataGrid数据表格及Pagination一起介绍一、通过标记创建DataGrid,嵌套标签定义列表阅读详情

偷垃圾的猫

JavaScript 87,984 成员 224,681 内容

+ 关注 + 加入社区

切换为时间正序

无聊的上午 2018-02-11

打赏
举报

回答上述几个点： 1、easyui datagrid组件中的分页参数如果设置了显示，有默认参数，至于组件内数据有没有分页与这些参数的确有关系，但是别人做这个组件的人不是傻瓜，不会没意识到你漏加或者不加该参数造成的BUG的，默认参数我记得是5,10,15 2、在datagrid中使用url获取数据的方式，easyui会自动将一些分页需要的参数传给后台，可以在后台打印出来看看，easyui此处用的是ajax提交 3、如果使用外部传参的方式，分页函数要自己在调用easyui的分页组件，是比较麻烦的做法 4、datagrid有提供loadFilter的属性，可以在这个方法属性中得到后台返回后且还没有被grid加载的数据，这种方式也可以用来加工数据字段

无聊的上午 2018-02-11

打赏
举报

引用 43 楼 f61278569 的回复:

分页真有那么难吗？把要返回的list分页，在通过gson转换下就好啦

额。。别人是前端数据拿不到，数据过去了，可能是格式没对

无聊的上午 2018-02-11

打赏
举报

引用 24 楼 cchhzzyy 的回复:

我用我的第一种写法，easyUI表格中终于有了数据，可是分页好像没有用。官方文档上面是要把URL写在datagrid里面，才会带入分页行数和页数的。所以还是没有完成。哪位大神，帮帮忙啊

外部引入，要用easyui的分页组件做，意思就需要加载两个easyui的组件

路过打_酱油 2018-02-11

打赏
举报

分页真有那么难吗？把要返回的list分页，在通过gson转换下就好啦

无聊的上午 2018-02-09

打赏
举报

loadFilter : function(data){ //过滤数据操作 return value; }

无聊的上午 2018-02-09

打赏
举报

补充一下 loadFilter 是属性，参数是方法

无聊的上午 2018-02-09

打赏
举报

搞的好麻烦还用了ajax在外面看数据，easyui的datagrid有个loadFilter 方法，原本用法是过滤从后台传回的数据的，可以在此函数中加工回传的数据，在return时就会加载加工后的数组，当然如果有需要也可以用来查看你的数据是否正确，还有调试时最好用console.log打印，alert的数据显示有时候是不完整的这里建议你检查一下你回传的数据中的key是否与数据行中的field匹配如果数据一切都匹配，建议就在loadFilter 中做一次字符串转json的步骤在return出去试试

xiaoyuyu1111 2018-02-09

打赏
举报

不知道问题解决没有，但是rows是不是空，json数据是否符合，在请求的response里查看一下就看到了。

xiao_lone 2017-12-06

打赏
举报

json序列化后的jsonData格式再拼接result的字符串是什么，确定是json格式的吗

偷垃圾的猫 2017-12-05

打赏
举报

引用 36 楼 xiaoyuyu1111 的回复:

首先用loadData的这种数据加载方式，是不能使用datagrid自己的分页逻辑和事件的，除非你自己加上这些逻辑，如果你用loadData数据能出来，而后台的url出不来，那就是url返回的数据格式有问题。关于url返回数据正确后，分页的后台逻辑是要自己写的，easyui的前台是你传多少数据，就会显示多少数据，比如你传了1页10条，但你返回的是20条，它也会都显示出来，这是需要前后台配合的。后台请求有没有发出，要用浏览器调试看，不是没反应就是没发出请求。为了显示，我写了个假的url，虽然页面无反应，但是请求是发出了的。看form data数据

说的很有道理。经过这一步一步的测试下来，我写的能出数据的方法是因为在前台ajax里面将数据进行了转换，所以easyUI表格出现了数据，如果我直接传出来，页面不出数据的原因，确实是数据格式有问题，因为js里面提示那个rows为null，说明easyUI没有接收到。。。可是我在后台里面用了json转对象的方法的，，，还是报这个错误。这是我写的后台方法

xiaoyuyu1111 2017-12-04

打赏
举报

首先用loadData的这种数据加载方式，是不能使用datagrid自己的分页逻辑和事件的，除非你自己加上这些逻辑，如果你用loadData数据能出来，而后台的url出不来，那就是url返回的数据格式有问题。关于url返回数据正确后，分页的后台逻辑是要自己写的，easyui的前台是你传多少数据，就会显示多少数据，比如你传了1页10条，但你返回的是20条，它也会都显示出来，这是需要前后台配合的。后台请求有没有发出，要用浏览器调试看，不是没反应就是没发出请求。为了显示，我写了个假的url，虽然页面无反应，但是请求是发出了的。看form data数据

xiao_lone 2017-11-30

打赏
举报

$(function(){ var page_json= { pageSize: 10,//每页显示的记录条数，默认为10 pageList: [10,20,50],//可以设置每页记录条数的列表 displayMsg: '当前显示 {from} - {to} 条记录共 {total} 条记录', onSelectPage: function (pageNumber, pageSize) { pageChange(pageNumber, pageSize); }, layout: ['list', 'sep', 'first', 'prev', 'links', 'next', 'last', 'sep', 'refresh'] }; $(pid).datagrid('getPager').pagination(page_json);//初始化设置分页 }); function pageChange(index, size) { //在后台分页，ajax重新获取数据，返回data $(pid).datagrid('loadData', data); }

偷垃圾的猫 2017-11-29

打赏
举报

页面加载进去的时候，执行后台的方法是正确的，，rous和page的值，前台也能看出来啊。我现在说的是下拉列表的点击，和上一页下一页那些按钮的那些点击事件，根本就没有走后台方法。又何来的传值是否正确呢

夜明小肥猪 2017-11-28

打赏
举报

引用 32 楼 cchhzzyy 的回复:

但是我点击下拉列表的多少行，，和点击上一页、下一页，根本没有进入后台

你先在后台获取下rows和page看下传值是否正确，然后针对list拼一个分页的写法出来

偷垃圾的猫 2017-11-27

打赏
举报

但是我点击下拉列表的多少行，，和点击上一页、下一页，根本没有进入后台

夜明小肥猪 2017-11-27

打赏
举报

引用 30 楼 cchhzzyy 的回复:

还是不正确的

后台没有写分页吧，前台传过去的page和rows你没用用到，所以拼完json传回来的是全部数据。

偷垃圾的猫 2017-11-24

打赏
举报

pageList这个有的，，我是说点击以后多少列没有反应。照道理是点击了10列，显示10列，，点击20列，显示20列。。可是没有用，分页参数不起作用

偷垃圾的猫 2017-11-24

打赏
举报

还是不正确的

zk_Kang 2017-11-24

打赏
举报

引用 28 楼 cchhzzyy 的回复:

pageList这个有的，，我是说点击以后多少列没有反应。照道理是点击了10列，显示10列，，点击20列，显示20列。。可是没有用，分页参数不起作用

pageSize:10, pageList: [10, 20, 30,40]//这两个要一起存在，不能单独使用，你说的点击每页显示条数不起作用，这个。。是不是测试数据太少了。。没遇到过。

zk_Kang 2017-11-23

打赏
举报

引用 20 楼 cchhzzyy 的回复:

这种写法我不知道怎么写

你将datagrid里面的url置空为‘’；在后面加上 $.ajax({ beforeSend: function(xhr) { xhr.setRequestHeader('Authorization', 'Bearer ' + $.session.get("token")); }, url: url, type: "post", contentType: 'application/json;charset=utf-8', dataType: "json", data: null,//这里是传递的数据，没有可以写null success: function(data) { console.log(data);//data就是后台传递过来的值 $("#id").datagrid("loadData", $.parseJSON(data).rows);//给传递过来的data中加入一个字段，就是“page”：1 }, async: true, error: function(er) { alert('错误:' + JSON.stringify(er)); } });

加载更多回复（26）

easyUI datagrid一直不出数据

相关推荐