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

2015-01-24信息快讯网

Ext.data.PagingMemoryProxy分页一次性读取数据的实现代码,需要的朋友可以参考下。

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数据结构 算法(PHP描述) 简单选择排序 simple selection sort
ThinkPHP与PHPExcel冲突解决方法
PHP源码之explode使用说明
PHP FOR MYSQL 代码生成助手(根据Mysql里的字段自动生成类文件的)
PHP中static关键字原理的学习研究分析
PHP的explode和implode的使用说明
php中用foreach来操作数组的代码
PHP Undefined index报错的修复方法
php max_execution_time执行时间问题
php入门学习知识点八 PHP中for循环基本应用之九九乘法口绝表
PHP 数据结构 算法描述 冒泡排序 bubble sort
php设计模式 State (状态模式)
php异常:Parse error: syntax error, unexpected T_ENCAPSED_AND_WHITESPACE eval()'d code error
PHP中使用gettext来支持多语言的方法
对text数据类型不支持代码页转换 从: 1252 到: 936
写php分页时出现的Fatal error的解决方法
PHP stream_context_create()作用和用法分析
php中突破基于HTTP_REFERER的防盗链措施(stream_context_create)
用php的ob_start来生成静态页面的方法分析
Wordpress 相册插件 NextGEN-Gallery 添加目录将中文转为拼音的解决办法
通俗易懂的php防注入代码
用PHP实现读取和编写XML DOM代码
ExtJS与PHP、MySQL实现存储的方法
Smarty Foreach 使用说明
mysql From_unixtime及UNIX_TIMESTAMP及DATE_FORMAT日期函数
ajax+php打造进度条 readyState各状态
php Smarty date_format [格式化时间日期]
PHP 页面编码声明方法详解(header或meta)
PHP 最大运行时间 max_execution_time修改方法
PHP clearstatcache()函数详解
php下使用SimpleXML 处理XML 文件
用PHP ob_start()控制浏览器cache、生成html实现代码
php foreach 使用&(与运算符)引用赋值要注意的问题
两个开源的Php输出Excel文件类
Linux下将excel数据导入到mssql数据库中的方法
Zend framework处理一个http请求的流程分析
PHP源码之 ext/mysql扩展部分
PHP中查询SQL Server或Sybase时TEXT字段被截断的解决方法
©2014-2024 dbsqp.com