`
rikugun
  • 浏览: 350461 次
  • 性别: Icon_minigender_1
  • 来自: 南宁
社区版块
存档分类
最新评论

Panel迟加载的方法(基本解决)

    博客分类:
  • Js
阅读更多
最近在研究Ext,做了一个ajax调取后台数据再显示出来的demo.
在Panel中要用到store中的数据.
请问如何才能让panel在store.load后才表现出来.谢谢

下面是部分代码

show.jsp
Ext.onReady(function(){
if (newsid==''){
	Ext.Msg.alert('抱歉','您所输入的文章不存在或已被删除',function(){
		history.go(-1);
	}
					  );
};

var store = new Ext.data.JsonStore({
    url: 'ajax.jsp?rpc=getnews&id='+newsid,
    root: 'root',
    fields: ['n_ttitle','n_content',{name:'n_time', type:'date'}],
    autoLoad:true
});
    var p = new Ext.Panel({
        title:'标题',
       //title:store.getAt(0).get('n_ttitle'),如果store还未加载就会出错
        collapsible:true,        
        width:800,
        html:'文章在这里\u002F'
      //html:store.getAt(0).get('n_content'),文章内容
    });
   p.render('content');
});


后台传过来的数据
{ "root": [{'n_ttitle': '文章标题 ','n_content': '文章内容','n_time': '2008-3-10 14:47:42'}]
}


以下是解决方案:
gdyxml2000 写道
加上如下代码:
store.on('load', function(_store, _records, _options){
    var title = _records[0].get('n_ttitle');
    var content = _records[0].get('n_content');
    p.setTitle(title);
    p.html = content;
    p.doLayout();
});


分享到:
评论
5 楼 gdyxml2000 2008-03-25  


p.html = content;

换成

p.body.update(content);

4 楼 rikugun 2008-03-24  
gdyxml2000 写道
加上如下代码:
store.on('load', function(_store, _records, _options){
    var title = _records[0].get('n_ttitle');
    var content = _records[0].get('n_content');
    p.setTitle(title);
    p.html = content;
    p.doLayout();
});



感谢gdyxml2000帮助解决了问题

还有就是:
p.html = content;
这个不能更新panel中的html内容.
3 楼 gdyxml2000 2008-03-24  
加上如下代码:
store.on('load', function(_store, _records, _options){
    var title = _records[0].get('n_ttitle');
    var content = _records[0].get('n_content');
    p.setTitle(title);
    p.html = content;
    p.doLayout();
});
2 楼 rikugun 2008-03-24  
<p>回楼上的.<br/>这样也会报错<br/><br/>firebug报错为:</p><p> </p><p><span class='objectBox objectBox-errorMessage hasTwisty hasBreakSwitch opened'/></p><div class='errorTitle'>store.getAt(0) has no properties</div><div class='errorTrace'><div class='objectBox objectBox-stackFrame'><a class='objectLink'>(no name)</a>()<span class='objectLink-sourceLink objectLink'>          </span></div><div class='objectBox objectBox-stackFrame'><a class='objectLink'>fire</a>()<span class='objectLink-sourceLink objectLink'>                    ext-all-debug.js (line 1505)</span></div><div class='objectBox objectBox-stackFrame'><a class='objectLink'>fireDocReady</a>()<span class='objectLink-sourceLink objectLink'>               ext-all-debug.js (line 1542)</span></div></div><div class='errorSourceBox errorSource-exec'><img class='errorBreak' title='Break on this error' alt=''/><span class='errorSource'>title:store.getAt(0).get('n_ttitle'),</span></div> <p/><p>初步分析是因为初始化时,ajax请求的数据还没有加载过来,Panel 就开始加载了.</p><p>到</p><p>title:store.getAt(0).get('n_ttitle'),</p><p>这步时,store还没有加载完</p><p> </p><p> </p>
1 楼 lfzx_1227 2008-03-24  
在显示Panel前,加上这句 store.load();

相关推荐

    C#中主窗体Panel中加载其他多个窗体Panel控件

    二、加载多个窗体Panel控件的方法 1. 创建子窗体类 首先,我们需要为每个要加载到主窗体Panel中的子窗体创建一个独立的类。这些类通常继承自`System.Windows.Forms.Form`,并包含所需的Panel控件和其他元素。 ```...

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    动态加载本地数据到`Ext.Panel`通常涉及到异步请求,使用`Ajax`或`Store`的`load`方法,通过URL获取JSON或XML格式的数据,并将其渲染到面板内。 例如: ```javascript var panel = Ext.create('Ext.Panel', { ...

    extjs4.x tabpanel 动态加载panel和html例子

    text: '加载Panel', handler: function() { loadTab({ title: '新面板', html: '&lt;h1&gt;这是动态加载的HTML内容&lt;/h1&gt;' }); } }); ``` 4. **加载远程HTML内容** 如果需要从服务器动态获取HTML内容,可以使用`...

    delphi 注册方法加载TFrame容器

    首先,我们需要了解TFrame的基本概念。TFrame是VCL(Visual Component Library)框架的一部分,它是一个可以在运行时动态添加到窗体上的组件集合。TFrame通常用于创建可复用的用户界面元素,比如对话框、表单或特定...

    ext使用--Panel和iframe联合使用时页面高度的解决方法

    通过以上方法,我们可以确保Panel根据IFrame内容的高度动态调整,避免滚动条的出现或内容被裁剪。在实际应用中,应根据项目需求和兼容性考虑选择最适合的解决方案。同时,确保对IFrame的安全性进行充分考虑,防止跨...

    C# WinForm窗体控件Panel修改边框颜色以及边框宽度方法

    首先,我们需要了解Panel控件的基本属性。在WinForm中,Panel控件默认具有一个边框,它的样式可以通过`BorderStyle`属性来设置,常见的选项有None(无边框)、FixedSingle(固定单边框)、Fixed3D(固定三维边框)等...

    C# winform 透明Panel

    为了使整个Panel包括子控件都透明,我们需要重写控件的`OnPaintBackground`方法并禁用自动绘制背景。 以下是实现透明Panel的基本步骤: 1. 创建一个新的类,继承自`System.Windows.Forms.Panel`。 2. 在新类中,...

    Android- 超炫image-slide-panel图片照片墙的加载和滑动特效.rar

    这个压缩包文件“Android- 超炫image-slide-panel图片照片墙的加载和滑动特效.rar”显然是一个关于如何实现这种效果的资源集合。虽然无法逐一验证每个文件的可用性,但我们可以根据描述来探讨一下实现此类功能的关键...

    C# 自定义控件 实现可伸缩的Panel控件

    2. **方法**:我们需要至少两个主要方法来处理Panel的展开和折叠。`Expand()`和`Collapse()`方法将改变Panel的尺寸,同时更新其关联的Panel。此外,可能还需要一个`LinkPanels()`方法来设置或更新关联的Panel列表。 ...

    博客配套代码(panel)

    本篇文章将深入探讨jQuery Easy UI中的面板布局,包括其基本概念、使用方法以及常见应用。 1. **面板(Panel)基础** jQuery Easy UI的Panel组件是一个可自定义的容器,可以容纳其他HTML元素或Easy UI组件。它提供...

    根据xml生成 组合panel布局

    总结来说,"根据xml生成 组合panel布局"是一种利用XML文件来动态构建和管理Winform应用中多Panel组合布局的方法。通过这种方式,开发者可以更加方便地实现复杂界面的创建,提升用户体验,并降低维护成本。

    Delphi 动态创建Panel

    首先,我们要理解动态创建组件的基本原理。在Delphi中,可以通过在代码中实例化组件类来实现动态创建。以Panel为例,Panel的类名为TPanel。在运行时,我们可以使用以下代码创建一个新的Panel: ```delphi var ...

    c# panel的拖动和缩放

    2. 设置`Panel`的基本属性,如大小、位置、背景色等。 3. 将`Panel`添加到父容器(如`Form`)的控件集合中。 例如: ```csharp Panel newPanel = new Panel(); newPanel.Size = new Size(200, 200); newPanel....

    vb.net 将窗口显示成panel控件中

    在窗体加载或应用程序启动时,我们可以默认显示一个Panel,其余Panel则隐藏。 接着,我们需要创建多个子窗体,每个子窗体代表一个独立的“窗口”内容。这些窗体通常继承自System.Windows.Forms.Form类,并且可以...

    EPLAN Pro Panel实例入门

    - **软件操作基础**:熟悉EPLAN Pro Panel 的界面布局和基本操作方法。 2. **实践步骤**: - **创建项目**:启动软件后,新建一个项目,并设置项目的基本属性。 - **选择模板**:根据实际需求选择合适的模板,...

    c# winform panel 流式布局 panel块可自动排列

    例如,你可以创建一个方法,接收控件宽度和高度,以及间距作为参数,然后遍历Panel的Controls集合,计算每个控件的X和Y坐标。如果一行填满,下一个控件将开始新的一行。 ```csharp private void ArrangeControls...

    绘制圆角panel.net 制作圆角panel的源码

    为了实现圆角`Panel`,我们需要自定义一个控件类,并覆盖其`OnPaint`方法来实现自定义的绘图逻辑。以下将详细介绍如何通过VB.NET来制作一个可运行的圆角`Panel`。 首先,我们需要创建一个新的用户控件(UserControl...

    delphi 真正透明panel ,使用简单

    在Paint事件中,我们可以获取到Canvas对象,然后通过Canvas的Draw()方法,将Panel的内容绘制到其父控件上,但不包括背景部分,这样就实现了透明的效果。 下面是一个简单的步骤概述: 1. 创建一个新的非可视组件,...

    panel容器的分页

    在实际开发中,除了基本的Panel控件分页外,还可以结合其他技术,如TabControl、DataGridView的分页功能,或者使用第三方控件库来提供更丰富的分页效果。对于大型应用,还可以考虑使用数据绑定和数据虚拟化技术,以...

    Extjs 重写Panel添加click事件

    首先,理解Panel的基本结构是至关重要的。一个Panel由多个部分组成,包括头部(header)、主体(body)和脚部(footer)。我们可以通过配置对象来设置Panel的各种属性,如title、width、height等。当涉及到事件监听...

Global site tag (gtag.js) - Google Analytics