EasyUI-datagrid中load,reload,loadData方法的区别
EasyUI比较常用，其中的datagrid比较复杂，它有其中有load,reload,loadData这三个方法，它们都有相同的功能，都是加载数据的，但又有区别。
load方法，比如我已经定义一个datagrid的id为grid，那这个方法的使用方式为
$(“#grid”).datagrid(“load”,{ });
它的参数为一个json对象，里面写的是你要传输的参数的键值对，调用这个方法来加载数据的时候，它传给后台的分页信息是从第一页开始的。
reload方法，使用方式也跟load的一样
$(“#grid”).datagrid(“reload”,{ });
看它的名字应该就可以知道它的做用了，没错，它跟load一样有加载数据功能，也一样的传参数，但它传给后台的分布信息是当前的页码，就是实现刷新当前页的功能。
loadData方法，这个方法有比较大的不同，首先它加载的本地数据，就是不会跟后台什么的有交互，它的使用方式是
$(“#grid”).datagrid(“loadData”,{ “total”:”30″,rows:[] });
看到没，它是比较灵活的，可以设置分页信息的，total就是行数嘛，当然你也可以设置它的当前页，而它那个rows属性设的就是你所要加载的行的集合。
var bbc="";
$(function(){
$("#test").datagrid({
loadFilter: function (data){bbc=data;return bbc;},
/*loadFilter: function (data) {
for (var i = 0; i < data.rows.length; i++) {
for (var att in data.rows[i]) {
if (typeof (data.rows[i][att]) == "string") {
data.rows[i][att] = data.rows[i][att].replace(/</g, "<").replace(/>/g, ">");
}
}
}
return data;
} ,*/
title:'My DataGrid',
//iconCls:'icon-save',
//nowrap: false,
//striped: true,
//collapsible:true,
url:'datagrid_data001.json',
//sortName: 'code',
//sortOrder: 'desc',
//remoteSort: false,
singleSelect:true,
rownumbers:true,
idField:'code',
frozenColumns:[[
/*{field:'ck',checkbox:true},*/
{title:'退货单号',field:'code',width:80,sortable:true, rowspan:2}
]],
columns:[[
{title:'退货单明细',colspan:3},
{field:'opt',title:'操作',width:100,align:'center', rowspan:2,
formatter:function(value,rec){
return '<span style="color:#08f;cursor:pointer;" onclick="kankan(this)">查看</span>';
}
}
],[
{field:'name',title:'申请人',width:100},
{field:'money',title:'申请金额',width:100,rowspan:2,sortable:true,
sorter:function(a,b){
return (a>b?-1:1);
}
},
{field:'col4',title:'审核状态',width:100,rowspan:2}
]]
});
})
function kankan(she){
var bb=$(she).parent().parent().parent().attr("datagrid-row-index");
/*alert(bb);
$("#test").datagrid('selectRow',0)
var row=$("#test").datagrid('getSelected');
alert(row.id)*/
var ccb={total:bbc.total,rows:[bbc.rows[bb]]}
/*var ccb='"total"';
ccb=ccb+":";
ccb=ccb+bbc.total;
ccb=ccb+",";
ccb=ccb+'"rows":';
ccb=ccb+"[";
ccb=ccb+bbc.rows[bb];
ccb=ccb+"]";*/
$('#win').window({
width:600,
height:400,
modal:true,
collapsible:false,
minimizable:false,
maximizable:false
});
//$("#win").text(item.address);
$("#win").datagrid({
//rowStyler:function(bb,bb){return 'background:#fff'},
//url:'datagrid_data001.json',
singleSelect:true,
columns:[[{title:'退货单号',field:'code',width:80,align:'center'},
{field:'name',title:'申请人',width:100,align:'center'},
{field:'money',title:'申请金额',width:100,align:'center'},
{field:'col4',title:'审核状态',width:100,align:'center'},
{field:'address',title:'地址',width:180,align:'center'}
]]
})
//alert(bbc.total);
$(function(){ $('#win').datagrid('loadData', ccb); /*alert('here');*/})
}
数据源
{
"total":10456239,
"rows":[
{"id":"1","code":"001","name":"张一一","money":"$ 129.00","col4":"待审核","address":" Shanghai Pudong China1"},
{"id":"2","code":"002","name":"张一二","money":"$ 119.00","col4":"待审核","address":" Anhai Pudong China2"},
{"id":"3","code":"003","name":"张一三","money":"$ 128.00","col4":"待审核","address":" Shanghai Pudong China3"},
{"id":"4","code":"004","name":"张一四","money":"$ 118.00","col4":"待审核","address":" Anhai Pudong China4"},
{"id":"5","code":"005","name":"张一五","money":"$ 109.00","col4":"待审核","address":" Shanghai Pudong China5"},
{"id":"6","code":"006","name":"张一六","money":"$ 109.00","col4":"待审核","address":" Anhai Pudong China6"},
{"id":"7","code":"007","name":"张一七","money":"$ 159.00","col4":"待审核","address":" Anhai Pudong China7"},
{"id":"8","code":"008","name":"张一八","money":"$ 158.00","col4":"待审核","address":" Anhai Pudong China8"},
{"id":"9","code":"009","name":"张一九","money":"$ 156.00","col4":"待审核","address":" Shanghai Pudong China9"},
{"id":"10","code":"010","name":"张一十","money":"$ 158.00","col4":"待审核","address":" Shanghai Pudong China10"}
]
}
html
<body>
<div id="win" title="My Window"></div>
<table id="test"></table>
</body>
loadData ： 参数(data) 加载本地数据，旧的行会被移除。
loadFilter : 类型(function) 返回过滤的数据去显示。这个函数需要一个参数'data'，表示原始数据。你可以把原始数据变成标准数据格式，此函数必须返回标准数据对象，含有 'total' 和 'rows' 特性。
EasyUI-datagrid中load,reload,loadData方法的区别的更多相关文章
- datagrid中load,reload,loadData方法的区别
它有其中有load,reload,loadData这三个方法,它们都有相同的功能,都是加载数据的,但又有区别. load方法,比如我已经定义一个datagrid的id为grid,那这个方法的使用方式为 ...
- easyuidatagrid中load,reload,loadData的区别
摘要:datagrid中有load,reload,loadData那三个方式,皆是加载数据的,但又有差别.下面让我们一起来看看: 首先,load方法,比如我已经定义一个datagrid的id为grid ...
- easyuidatagrid中load,reload,loadData的区别。
摘要:datagrid中有load,reload,loadData那三个方式,皆是加载数据的,但又有差别.下面让我们一起来看看: 首先,load方法,比如我已经定义一个datagrid的id为grid ...
- hibernate中load和get方法的区别
1.读取时机不同(当lazy=true的时候) load是采用延迟机制(load语句不读库,等使用非主键时才去读库),而get不采用延 迟机制(get语句时马上读库): 2.搜索不到数据时的情 ...
- easyui datagrid中 多表头方法总结
easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...
- jQuery EasyUI datagrid实现本地分页的方法
http://www.codeweblog.com/jquery-easyui-datagrid%e5%ae%9e%e7%8e%b0%e6%9c%ac%e5%9c%b0%e5%88%86%e9%a1% ...
- JQuery easyUi datagrid 中 自定义editor作为列表操作按钮列
转自 http://blog.csdn.net/tianlincao/article/details/7494467 前言 JQuery easyUi datagrid 中 使用datagrid生 ...
- easyui datagrid 中序列化后的日期格式化
1.在easyui datagrid 中序列化后的日期显示为:/Date(1433377800000)/ 2.格式化后的显示为: 2015-06-04 08:30:00 3.使用代码如下: 3.1. ...
- Java线程中run和start方法的区别
http://bbs.csdn.net/topics/350206340 Thread类中run()和start()方法的区别如下:run()方法:在本线程内调用该Runnable对象的run()方法 ...
随机推荐
- 2.Java基础：方法定义和调用
一.方法的定义 1.类的方法代表的是实力的某种行为(或功能) 方法的定义:方法类型 . 方法签名 . 方法体 2.定义类的方法 访问修饰符 类型 方法名(参数列表){ ///方法体 } 3.把方法当作 ...
- python学习笔记011——闭包
1 定义 定义:在计算机科学中,闭包是词法闭包的简称,是引用了自由变量的函数 简单地说:闭包就是能够读取其他函数内部变量的函数,闭包是将函数内部和函数外部连接起来的桥梁.——来源百度百科 2 描述 形 ...
- Unix环境高级编程(二十)伪终端
1.综述 伪终端对于一个应用程序而言,看上去像一个终端,但事实上伪终端并不是一个真正的终端.从内核角度看,伪终端看起来像一个双向管道,而事实上Solaris的伪终端就是用STREAMS构建的.伪终端总 ...
- 《TCP/IP具体解释卷2：实现》笔记--选路请求和选路消息
内核的各种协议并不直接使用前面提供的函数来訪问选路树,而是调用几个函数:rtalloc和rtallocl是完毕路由表查询的两个 函数:rtrequest函数用于加入和删除路由表项:另外大多数接口在接口 ...
- 控件不响应OnMouseMove
原文链接: http://bbs.csdn.net/topics/370017205 问:我继承CStatic写了个CStaticEx,设为Rectangle类型,用来画图.把这个控件添加到了一个Vi ...
- Python count() 方法
描述 count() 方法用于统计字符串中某个子字符串出现的次数,可选参数为开始搜索与结束搜索的位置索引. 语法 count() 方法语法: S.count(sub[,start=0[,end=len ...
- SQL批量删除用户表(先删除所有外键约束,再删除所有表)
--批量删除用户表 --1.删除外键约束DECLARE c1 cursor for select 'alter table ['+ object_name(parent_obj) + '] d ...
- React.Fragment 的作用：代替div作为外层
https://segmentfault.com/a/1190000013220508 import React, { Fragment } from 'react'; <Fragment> ...
- nginx是以多进程的方式来工作的
nginx是以多进程的方式来工作的. nginx在启动后,会有一个master进程和多个worker进程. master进程主要用来管理worker进程: 包含: 1.接收来自外界的信号,向各work ...
- 「Java Web」主页静态化的实现
一个站点的主页一般不会频繁变动,而大多数用户在訪问站点时不过浏览一下主页(未登陆).然后就离开了.对于这类訪问请求.假设每次都要通过查询数据库来显示主页的话,显然会给server带来多余的压力. 这时 ...