Ext.data.PagingMemoryProxy分页一次性读取数据的实现代码


Posted in PHP onApril 07, 2010

1 建立get.php
get.php=>

<?php 
$data=array( 
array(1,"yixing",123), 
array(2,"chenlin",13), 
array(3,"lixin",123), 
array(4,"liumei",344), 
array(5,"qiuye",343), 
array(6,"zhangli",231), 
array(7,"chenggong",1234), 
array(9,"linmei",123), 
array(10,"gaoxin",234), 
array(11,"ximi",1234), 
array(12,"suoming",1234) 
); 
echo json_encode($data); 
?>

2 在下载的extjs中搜索到PagingMemoryProxy.js,与get.php放在一个文件夹中
3 建立文件grid.html
grid.html=>
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gbk"> 
<script type="text/javascript" src="PagingMemoryProxy.js"></script> 
<script type="text/javascript"> 
Ext.onReady(function() { 
store=new Ext.data.Store({ 
reader:new Ext.data.ArrayReader({},[ //读数组到一个元数据对象 
{name:'id'}, 
{name:'name'}, 
{name:'password'} 
]) 
}); 
Ext.Ajax.request({ //读取后台传递于前台数据 
url: 'get.php', 
method:'get', 
success:function(response, opts){ 
var obj= Ext.decode(response.responseText);//obj储存响应的数据 
store.proxy = new Ext.data.PagingMemoryProxy(obj),//PagingMemoryProxy() 一次性读取数据 
store.load({params:{start:0,limit:5}});//按5条记录分布 
}, 
failure: function(){Ext.Msg.alert("failure");} 
}); 
var grid=new Ext.grid.GridPanel({ 
store:store,//装载store 
mode:'remote', 
width:450, 
height:200, 
applyTo:'grid', 
frame:true, 
columns:[ 
{header:"number",width:50,dataIndex:'id',sortable:true}, 
{header:"name",width:80,dataIndex:'name',sortable:true}, 
{header:"password",width:80,dataIndex:'password',sortable:true} 
], 
tbar:new Ext.PagingToolbar({//工具栏 
pageSize:5, 
store:store, 
displayInfo:true, 
displayMsg:'From {0} To {1} records,all records are {2} ', 
emptyMsg:"no records" 
}), 
viewConfig:{ 
forceFit:true 
} 
}) 
}); 
</script> 
</head> 
<body> 
<div id="grid"></div> 
</body> 
</html>

4 建立文件r01.js
r01.js=>
Ext.onReady(function() { 
Ext.QuickTips.init(); 
var root=new Ext.tree.TreeNode({ 
text:'简单树形', 
expanded:true 
}) 
var user=(new Ext.tree.TreeNode({ 
text:'用户', 
expanded:true 
}) 
) 
var user1=new Ext.tree.TreeNode({ 
text:'用户1' 
}) 
var user2=new Ext.tree.TreeNode({ 
text:'用户2', 
}) 
root.appendChild(user); 
user.appendChild(user1); 
user.appendChild(user2); 
//建立根节点 
var tree=new Ext.tree.TreePanel({ 
width:180, 
height:300, 
root:root 
}) 
//中间区域 
var tabPanel = new Ext.TabPanel({ 
region : 'center', 
enableTabScroll : true, 
activeTab :0, 
margins:'5 5 5 5', 
items : [{ 
id : 'homePage', 
title : '首页', 
autoScroll : true, 
html:'<div style="position:absolute;top:40%;left:40%>欢迎来到首页!</div>' 
}] 
}); 
function treeClick(){ 
tabPanel.add({ 
title:'用户', 
id:'1', 
activeTab:1, 
closable:true, 
autoLoad:{ 
url:'grid.html', 
scripts:true 
} 
}) 
} 
user1.on("click",treeClick); 
//界面显示 
new Ext.Viewport({ 
title:'Ext.Viewport示例', 
layout:'border', 
items:[ 
{ 
region:'west', 
layout:'fit', 
width:200, 
collapsible:true, 
margins:'5 0 5 5', 
items:tree 
},{ 
region:'center', 
width:200, 
layout:'fit', 
margins:'5 0 5 5', 
items:tabPanel 
}] 
}) 
});

5 建立r01.php
r01.php=>
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gbk"> 
<title>Insert title here</title> 
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/ext/resources/css/ext-all.css" /> 
<script type="text/javascript" src="http://www.cnblogs.com/ext/adapter/ext/ext-base.js"></script> 
<script type="text/javascript" src="http://www.cnblogs.com/ext/ext-all.js"></script> 
<script type="text/javascript" src="r01.js"></script> 
</head> 
<body> 
</body> 
</html>

6 浏览器中输入http://localhost/register_01/r01/r01.php

Ext.data.PagingMemoryProxy分页一次性读取数据的实现代码 

Ext.data.PagingMemoryProxy分页一次性读取数据的实现代码
7 总结
树形监听事件:tree.on
Ext.data.ArrayReader读取数组到一个元数据对象

function(response, opts){ 
var obj= Ext.decode(response.responseText);//obj储存响应的数据 
store.proxy = new Ext.data.PagingMemoryProxy(obj),//PagingMemoryProxy()一次性读取数据 
store.load({params:{start:0,limit:5}});//按5条记录分布 
}//分页基本应用

Ext.PagingToolbar基本应用
extjs相关帮助文档:http://www.extjs.com/deploy/dev/docs/
PHP 相关文章推荐
深入phpMyAdmin的安装与配置的详细步骤
May 07 PHP
php session劫持和防范的方法
Nov 12 PHP
用php简单实现加减乘除计算器
Jan 06 PHP
thinkphp实现数组分页示例
Apr 13 PHP
php实现mysql备份恢复分卷处理的方法
Dec 26 PHP
编写PHP脚本过滤用户上传的图片
Jul 03 PHP
php类的定义与继承用法实例
Jul 07 PHP
PHP代码优化技巧小结
Sep 29 PHP
Laravel (Lumen) 解决JWT-Auth刷新token的问题
Oct 24 PHP
Yii2框架中一些折磨人的坑
Dec 15 PHP
PHP优化之批量操作MySQL实例分析
Apr 23 PHP
phpstudy2020搭建站点的实现示例
Oct 30 PHP
用PHP实现读取和编写XML DOM代码
Apr 07 #PHP
php session和cookie使用说明
Apr 07 #PHP
DedeCMS dede_channeltype表字段注释
Apr 07 #PHP
php抓取https的内容的代码
Apr 06 #PHP
php中几种常见安全设置详解
Apr 06 #PHP
PHP 检查扩展库或函数是否可用的代码
Apr 06 #PHP
php下关于中英数字混排的字符串分割问题
Apr 06 #PHP
You might like
百度站点地图(百度sitemap)生成方法分享
2014/01/09 PHP
如何批量清理系统临时文件(语言:C#、 C/C++、 php 、python 、java )
2016/02/01 PHP
php中file_get_contents()函数用法实例
2019/02/21 PHP
laravel框架中视图的基本使用方法分析
2019/11/23 PHP
非常漂亮的JS代码经典广告
2007/10/21 Javascript
Extjs学习笔记之七 布局
2010/01/08 Javascript
深入理解JavaScript 闭包究竟是什么
2013/04/12 Javascript
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
JavaScript中几个重要的属性(this、constructor、prototype)介绍
2013/05/19 Javascript
js 将图片连接转换成base64格式的简单实例
2016/08/10 Javascript
微信小程序 wx.request(object) API详解及实例代码
2016/09/30 Javascript
BootStrap 图标icon符号图标glyphicons不正常显示的快速解决办法
2016/12/08 Javascript
JS实现复制内容到剪贴板功能
2017/02/05 Javascript
JS排序算法之希尔排序与快速排序实现方法
2017/12/12 Javascript
JavaScript创建对象方法实例小结
2018/09/03 Javascript
javascript实现对话框功能警告(alert 消息对话框)确认(confirm 消息对话框)
2019/05/07 Javascript
vue 封装 Adminlte3组件的实现
2020/03/18 Javascript
Python字符串中查找子串小技巧
2015/04/10 Python
Python3常用内置方法代码实例
2019/11/18 Python
浅谈python print(xx, flush = True) 全网最清晰的解释
2020/02/21 Python
简述 Python 的类和对象
2020/08/21 Python
您的健身减肥和健康饮食专家:vitafy
2017/06/06 全球购物
欧洲领先的火车票和大巴票预订平台:Trainline
2018/12/26 全球购物
adidas爱尔兰官方网站:阿迪达斯运动鞋和运动服
2019/11/01 全球购物
俄罗斯厨房产品购物网站:COOK HOUSE
2021/03/15 全球购物
如何估计一张表的大小(假设该表中有1万条数据)
2016/03/27 面试题
本科生详细的自我评价
2013/09/19 职场文书
工商学院毕业生自荐信
2013/11/12 职场文书
运动会邀请函范文
2014/02/06 职场文书
接待员岗位责任制
2014/02/10 职场文书
廉洁自律承诺书
2014/03/27 职场文书
《开国大典》教学反思
2014/04/19 职场文书
党员教师自我剖析材料
2014/09/29 职场文书
青年联谊会致辞
2015/07/31 职场文书
初中数学课堂教学反思
2016/02/17 职场文书
员工保密协议范本,您一定得收藏!很有用!
2019/08/08 职场文书