easyui datagrid 绑定从后台得到的复杂的特殊数据结构

由于项目需要,从后台得到的数据统一为了类似{state:xxx,data:xxx,message:xxx}类型

但是easyui datagrid却只认{total:xxx,rows:xxx}。。。所以,整个前台都报错了,报错了就要解决,解决的过程中一共试过3中方式

1,datagrid不直接指定数据源,而是单独的ajax得到数据,然后在loadData绑进去,但是这样太麻烦了,不合理,显然不适用

2,重写ajax在得到数据的时候处理一下,网上找了段大神的代码就拿来用了,但是这样写灵活性不好,只能适用部分验证功能

(function ($) {
    var _ajax = $.ajax;
    $.ajax = function (opt) {
        var fn = {
            error: function (XMLHttpRequest, textStatus, errorThrown) { },
            success: function (data, textStatus) { }
        }
        if (opt.error) {
            fn.error = opt.error;
        }
        if (opt.success) {
            fn.success = opt.success;
        }
        var _opt = $.extend(opt, {
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                fn.error(XMLHttpRequest, textStatus, errorThrown);
            },
            success: function (data, textStatus, xhr) {
                fn.success(data.data, textStatus);
            }
        });
        _ajax(_opt);
    };
})(jQuery);

3,直接用easyui的数据表格属性loadFilter。。。。。(尼玛,折腾了2个小时才发现easyui自己就有数据过滤功能。。。。坑爹啊)

<script type="text/javascript">
        $(function () {
            $(‘#dgUser‘).datagrid({
                url: ‘index.ashx‘,
                columns: [[
                    { title: ‘UserID‘, field: ‘UserID‘, width: 100, align: ‘center‘ },
                    { title: ‘UserName‘, field: ‘UserName‘, width: 100, align: ‘center‘ }
                ]],
                loadFilter: function (data) {
                    return data.data;
                }
            });
        });
    </script>
时间: 2024-11-06 15:45:11

easyui datagrid 绑定从后台得到的复杂的特殊数据结构的相关文章

easyui datagrid 绑定json对象属性的属性

今天用easyui 的datagrid绑定数据时,后台提供的数据是实体类类型的,其中有一个实体类A的属性b是另一个实体类B类型的,而前台需要显示b的属性c,这下就悲剧了,前台没法直接绑定了,后来脑筋一转,想到了datagrid的列属性formatter,formatter提供了row,这样的话我们在formatter里面指定一下不就可以了吗 于是~ function dgDevice_datagrid() { $('#dgDevice').datagrid({ url: 'DeviceList.

EasyUI DataGrid绑定嵌套的json数据

现有json数据如下: {"total":2,"rows": [{"BarrackGUID":"dc1be891-4489-4eb8-bb1d-ba1debd59b07","BarrackName":"屋舍一","BarrackNumber":"0001","BarrackArea":"100平米",&quo

ssm+easyUI datagrid 不能显示后台controller层返回的json数据

后台打印查询出来的数据: {"total":29,"rows":[{"department_id":0,"department_name":"董事会办公室","id":1,"idcard":"3423243543534","phone":"15155157074","rname":&quo

JQuery EasyUI 学习——Struts2与EasyUI DataGrid数据表格结合使用显示数据库数据

因为EasyUI DataGrid只要取出后台传过来的一定格式的JSON数据,就可以在前台页面数据表格中,以一定形式显示数据库中的数据.此处,我们使用Struts2框架整合DataGrid,实现数据的显示. 一.页面内容 为了在页面中显示数据库中字段内容,需要定义一个table,通过EasyUI内部设计,自动显示数据,如下: <%@ page language="java" import="java.util.*" pageEncoding="UTF

jquery easyUI datagrid 通过一般处理程序绑定数据库

初学easyui,搞了三天,终于将datagrid与后台数据库绑定成功,界面有点不太美观,以后继续努力. 后台一般处理程序取数据代码 1 <%@ WebHandler Language="C#" Class="jsonSms_group" %> 2 3 using System; 4 using System.Web; 5 using System.Configuration; 6 using System.Data; 7 using System.Da

jQuery Easyui datagrid动态列绑定

前几天有人在使用jQuery EasyUI的datagrid时,遇到不会动态绑定列的情况,而网上给出的例子可能也是比较早的处理办法,竟然需要修改easyui源码,其实解决这问题的思路是很简单,我们只需修改要显示的列即可.那位朋友最后改为这种处理时,发现还是有问题,最终我发现她返回不是合法json,里边多个方括号,这里推荐大家使用本站的JSON在线校验格式化工具来验证返回json是否正确. 这里我们以上篇文章中类似的简单json来说明这个问题,比如后台要根据当前用户的权限返回不同的json: 分享

WPF DATAGrid 空白列 后台绑定列 处理

原文:WPF DATAGrid 空白列 后台绑定列 处理 AutoGenerateColumns <DataGrid x:Name="dataGrid" Margin="10,10,0,0" RowHeaderStyle="{DynamicResource DataGridRowHeaderStyle1}" > <DataGrid.Columns> <DataGridTextColumn Header="姓

easyui datagrid中datetime字段的显示和增删改查问题

datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借助于formatter来格式化时间格式 { title: '活动开始时间', field: 'BeginTime', width: 300, editor: { type: 'datetimebox', options: { required: true }, formatter: function

[JS][easyui]jQuery EasyUI Datagrid VirtualScrollView视图简单分析

 大家都知道EasyUI的Datagrid组件在加载大数据量时的优势并不是很明显,相对于其他一些框架,如果数据量达到几千,便会比较慢,特别是在IE下面.针对这种情况,我们首要做的是要相办法优化datagrid组件的各方面性能,不过任何事情都是可以变通解决的,virtualScrollView就是一种不错的解决方案. virtualScrollView的准则就是尽量少画tr到table里,表格的高度是有限的,而用户的可见区域是很有限的,所以数据量很大的时候,是没有必要将所有数据数据都画到表格中