收藏本站 收藏本站
積木網首頁 - 軟件測試 - 常用手冊 - 站長工具 - 技術社區
首頁 > JavaScript > extjs > 正文

首頁 - PHP - 數據庫 - 操作系統 - 游戲開發 - JS - Android - MySql - Redis - MongoDB - Win8 - Shell編程 - DOS命令 - jQuery - CSS樣式 - Python - Perl

Access - Oracle - DB2 - SQLServer - MsSql2008 - MsSql2005 - Sqlite - PostgreSQL - node.js - extjs - JavaScript vbs - Powershell - Ruby

extjs grid取到數據而不顯示的解決

找了快1個小時,就是不知道錯誤在哪里。。。郁悶
我在鼠標左側點擊tree節點,在右側創建一個標簽頁,這個已經能夠實現,于是我再在新建的標簽頁里嵌套一個Grid。
奇怪的問題出現了。。
FF和IE下都沒報錯。但是Grid就是不顯示。本來我以為我代碼錯誤。于是我狂找我的代碼問題,無意中關掉FF的firbug插件界面,grid就現實出來了。。。原來只要我的窗口發生任何變化Grid才會顯示出來。
請問這是我代碼問題還是bug?如何解決?
補充一下,我直接在TabPanel里面用items管理grid對象并沒問題。但是我用添加事件后在其中管理就出問題了。
文件都是封裝在類包里面的。所以只貼關鍵部分
這是監聽事件。
Java代碼
listeners:{
'click':function(node, event) {
event.stopEvent();
//把根節點的選擇判斷去除
if(node.text=="SamPeng" || node.text == "文章管理" || node.text == "產品管理" || node.text == "信息管理" || node.text == "來訪管理"){
}else{
var n = main.getComponent(node.id);
if (!n) { //判斷是否已經打開該面板
//如果是按的文章列表,新建一個列表對象并且丟進新的標簽頁
if(node.text == "文章列表"){
var grid=new SamPeng.account.list();
n = main.add({
'id':node.id,
'title':node.text,
items: [{layout:"fit",items:grid}]
});}
}
main.setActiveTab(n);
}
}
listeners:{
'click':function(node, event) {
event.stopEvent();
//把根節點的選擇判斷去除
if(node.text=="SamPeng" || node.text == "文章管理" || node.text == "產品管理" || node.text == "信息管理" || node.text == "來訪管理"){
}else{
var n = main.getComponent(node.id);
if (!n) { //判斷是否已經打開該面板
//如果是按的文章列表,新建一個列表對象并且丟進新的標簽頁
if(node.text == "文章列表"){
var grid=new SamPeng.account.list();
n = main.add({
'id':node.id,
'title':node.text,
items: [{layout:"fit",items:grid}]
});}
}
main.setActiveTab(n);
}
}
然后是我的tab面板創建類
Java代碼
* Copyright(c) 2008-2010, SamPeng Inc.
*/
package("SamPeng.panel");
/**
* 作用: 用來創建中間的主顯示面板
* 作者:SamPeng
* 時間:2008年9月24日1:24:42
*/
SamPeng.panel.main = function(config){
var config=config || {};
var deconfig={
renderTo:'mainlay',
width:1000,
height:561,
activeTab:0,
plain: true,
border: true,
tabPosition: 'top',
frame: true,
autoScroll: true,
enableTabScroll:true,//超過寬度就自動兩邊多出滾動條
items:[{
title:"首頁"
}
]
}
Ext.applyIf(config,deconfig);
SamPeng.panel.main.superclass.constructor.call(this,config);
}
Ext.extend(SamPeng.panel.main,Ext.TabPanel);
* Copyright(c) 2008-2010, SamPeng Inc.
*/
package("SamPeng.panel");
/**
* 作用: 用來創建中間的主顯示面板
* 作者:SamPeng
* 時間:2008年9月24日1:24:42
*/
SamPeng.panel.main = function(config){

var config=config || {};
var deconfig={
renderTo:'mainlay',
width:1000,
height:561,
activeTab:0,
plain: true,
border: true,
tabPosition: 'top',
frame: true,
autoScroll: true,
enableTabScroll:true,//超過寬度就自動兩邊多出滾動條
items:[{
title:"首頁"
}
]
}
Ext.applyIf(config,deconfig);
SamPeng.panel.main.superclass.constructor.call(this,config);
}
Ext.extend(SamPeng.panel.main,Ext.TabPanel);
Grid的就只貼數據源和屬性的了。
Java代碼
/*******************************************************
* 為表格建立數據源
* 鏈接后臺,并且按每一頁的數據列表返回
* 用Json數據格式傳遞
*******************************************************/
this.dataStore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'php/article_list.php',
disableCaching:false
}),
reader: new Ext.data.JsonReader({
root: 'results',
totalProperty: 'total',
id:'id'
},[
{name: 'id'},
{name: 'name'},
{name: 'typename'},
{name: 'time'},
])
});
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
。。。
。。。省略很多
。。。
/*******************************************************
* 構造編輯列表面板(GridPanel)
*******************************************************/
SamPeng.account.list.superclass.constructor.call(this, {
id: 'list-account-panel',
ds: this.dataStore,
cm: art_cm,
sm: selectBoxModel,
height:500,
tbar: pagingbar,
bbar: menubar,
loadMask: {msg: '讀取數據中 ...'},
enableColumnHide: false,
autoScroll:true
//region:'center'
});
Ext.extend(SamPeng.account.list, Ext.grid.GridPanel, {
reload : function() {
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
},
// 調用刪除數據
// 服務器通過接受參數返回刪除的數據
deleteData : function (jsonData) {
this.dataStore.load({params:{start:0, limit:this.myPageSize, delData:jsonData}});
}

/*******************************************************
* 為表格建立數據源
* 鏈接后臺,并且按每一頁的數據列表返回
* 用Json數據格式傳遞
*******************************************************/
this.dataStore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'php/article_list.php',
disableCaching:false
}),

reader: new Ext.data.JsonReader({
root: 'results',
totalProperty: 'total',
id:'id'
},[
{name: 'id'},
{name: 'name'},
{name: 'typename'},
{name: 'time'},
])
});
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
。。。
。。。省略很多
。。。
/*******************************************************
* 構造編輯列表面板(GridPanel)
*******************************************************/
SamPeng.account.list.superclass.constructor.call(this, {
id: 'list-account-panel',
ds: this.dataStore,
cm: art_cm,
sm: selectBoxModel,
height:500,
tbar: pagingbar,
bbar: menubar,
loadMask: {msg: '讀取數據中 ...'},
enableColumnHide: false,
autoScroll:true
//region:'center'
});
Ext.extend(SamPeng.account.list, Ext.grid.GridPanel, {
reload : function() {
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
},
// 調用刪除數據
// 服務器通過接受參數返回刪除的數據
deleteData : function (jsonData) {
this.dataStore.load({params:{start:0, limit:this.myPageSize, delData:jsonData}});
}
謝謝各位大俠了!
問題狀況是我瀏覽器不動,Grid死活不顯示,瀏覽器一變,Grid就出來了。而且是按照我設定的參數大小顯示的。不明白倒底問題出在哪里。只有這么多分了。望指教

本來以為是代碼有問題,看Firebug沒有報錯,并且觀察Firebug確實從服務端取得了數據。搞了很久沒有想出問題,但是什么也不干,把窗口最小化再最大化的時候,數據又出來了!!!
這可能是Extjs的一個Bug,從網上找類似的解決方法,找到了這個:
,后來又和qiuye402大俠進行了溝通終于搞定。

其實就是布局刷新的問題,只需將最外層的容器重新render一下就可以了。最外層的容器一般就是類似于viewport的東東了,剛開始不知道,一直重新render包含grid的panel,沒有效果,重新render viewport一切OK了!

ExtJS 簡介 讓你知道extjs是什么
(wlr的blog應用)(ExtJS的表格控件)(不同主題的ExtJS彈出框效果)ExtJS是一個用javascript寫的,主要用于創建前端用戶界面,是一個與后臺技術無關的前端ajax框

ExtJs 學習筆記 Hello World!第1/2頁
在了解基礎后,可能會用Ext+ajax開發一個簡單的小項目,會一點一滴的講解項目開發過程,希望能給大家帶來收獲!因為我本人也在學習這個框架,所

ExtJs 學習筆記基礎篇 Ext組件的使用第1/2頁
天介紹一下Ext中組件舉幾個簡單的例子做說明。注意:文章內容有些摘自本人學習過程中看到的資料。Ext2.0對框架進行了非常大的重構,其中最重要的

本周排行

更新排行

強悍的草根IT技術社區,這里應該有您想要的! 友情鏈接:b2b電子商務
Copyright © 2010 Gimoo.Net. All Rights Rreserved  京ICP備05050695號
捕鱼大师辅助软件 陕西十一选五任八遗漏 湖北快三中奖规则 股票实时行情软件 黑龙江11选五遗漏任三 天津体彩十一选五一定牛 赛车开奖 北京快3走势图形态走势 湖北快3走势图 初学基金者怎么玩基金 江苏7位数开奖查询 河南省体彩481走势图 华东六省15选5走势 江西11选5选号 广东十一选五追号软件 浙江体彩11选五玩法介绍 辽宁十一选五网上投注平台