1 建立get.php
get.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=>
複製代碼 代碼如下:
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:'歡迎來到首頁!'
}]
});
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=>
複製代碼 代碼如下:
Insert title here
6 瀏覽器中輸入http://localhost/register_01/r01/r01.php
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/
http://www.bkjia.com/PHPjc/321600.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/321600.htmlTechArticle1 建立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...
