彩世界平台-彩世界时时app-彩世界开奖app苹果下载

热门关键词: 彩世界平台,彩世界时时app,彩世界开奖app苹果下载

您的位置:彩世界平台 > 学会党委 > extjs grid取到数据而不显示的解决

extjs grid取到数据而不显示的解决

发布时间:2019-09-07 04:16编辑:学会党委浏览(145)

    找了快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了!

    我在鼠标左侧点击tree节点,在右侧创建一个标签页,这个已经能够实现,于是我再在新...

    本文由彩世界平台发布于学会党委,转载请注明出处:extjs grid取到数据而不显示的解决

    关键词: