EXTJS ——Tabpanel_afterRender

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

关于1 贴个图。。
错误情况的代码：   var tabs = new Ext.TabPanel({
                                renderTo: strspot[a] + '-body',                                activeTab: 0,
                                tabCls: 'tab-class',
                                items: [{
                                    title: '实时数据',
                                    html: html,
                                    afterRender: function () {                                    }
                                }, {
                                    title: '实时曲线',
                                    html: '<div id=' + usualldivid + ' class=tab_kid></div>'
                                }],                            });而很奇怪。。
第二个里面添加afterRender却没有问题。。
你好，下面的代码经测试没有问题，只不过我是用的EXT4.1.0版的，
Ext.onReady(function(){
Ext.QuickTips.init();
var tabs = Ext.create("Ext.tab.Panel",{
       // renderTo: strspot[a] + '-body',
       region : 'center',
        activeTab: 0,
        tabCls: 'tab-class',
        items: [{
        title: '实时数据',
        //html: html,
        afterRender: function () {
        }
        }, {
        title: '实时曲线'   ,
        afterRender: function () {
        }
        //html: '<div id=' + usualldivid + ' class=tab_kid></div>'
        }]
        });

         Ext.create('Ext.container.Viewport', {

                    layout : 'border',//Border布局

                    items : [ tabs ]

                });
});
你好我参照您的代码  问题还是没有解决
感谢你的回复
这样的先贴张图如图  我目前做的效果是点击左侧的tree 然后生成相应的panel  而panel中再添加tab我遇到的问题是tab添加之后想要在实时刷新数据的时候发现读取不到里面的容器，并且出现了tab失效的情况
这是我修改后的代码  Ext.onReady(function () {
                                Ext.QuickTips.init();
                                var panel = Ext.create('Ext.Panel', {
                                    height: 200,
                                    width: 300,
                                    id: strspot[a],
                                    title: strspot[a],
                                    renderTo: 'Div1',//指向的容器
                                    headerCssClass: 'x-panel-header-title',//给顶部TITLE定义指定的class用来修改css
                                    closable: true,
                                    frame: true,
                                    footer: true,//创建底部
                                    componentCls: 'floatpl',//排序样式
                                    //bufferResize :true,//窗体的样式在内存中缓冲布局默认100ms 适用与高开销的布局
                                    // html: html,                                    close: function () {
                                        //alert(this.id);
                                        var nodes = $('#tt2').tree('getChecked');//获取所有被勾选的值
                                        //   alert(this.id);                                        for (var a = 0; a < nodes.length; a++) {//在所有已选的checkbox中寻找匹配的节点，然后取消节点
                                            if (nodes[a].text == this.id) {
                                                $("#tt2").tree('uncheck', nodes[a].target);
                                            }
                                        }
                                        //   alert(treenode);
                                        this.destroy();//移除元素
                                    }
                                });
                                divid = "chart_" + strspot[a];
                                var name = strspot[a].replace('#', '￥');
                                var tabs = new Ext.TabPanel({
                                    renderTo: strspot[a] + '-body',
                                    activeTab: 0,
                                    tabCls: 'tab-class',
                                    items: [{
                                        title: "实时数据",
                                       // html: html,
                                        //afterRender: function () { }//在这里添加 afterRender tab便失效了
                                    },
                                        {
                                            title: "实时曲线",
                                            loader: {
                                                url: 'Curce.aspx?name=' + name,
                                                contentType: 'html',
                                                loadMask: true
                                            },
                                            listeners: {
                                                activate: function (tabs) {
                                                    tabs.loader.load();
                                                }
                                            }
                                        }]
                                });
                                Ext.create('Ext.container.Viewport', {                                    layout: 'border',//Border布局                                    items: [tabs]                                });
                            })
或许是版本的问题  我用的是4.0.7的版本
返回的数据是已JSON的数据格式  数据是可以接受到已经alert出来了只是找不到EXT的容器
刷新我是单独在页面中写了个方法
       Ext.onReady(function () {
            //数据实时加载
            setTimeout(function () {
                GetRealTimeDate();
            }, 200);//2s
            setInterval(function () {
                // GetRealTimeDate();
            }, 3000)
        });
像这样子
我的方法中有用JQ 和com 还有EXT的方法都没有取到我想要的容器
我不知道你具体是如何获取容器的，
EXT 有个方法是： Ext.getCmp("容器ID").add(json);json可以是拼接的一个items，如：
[{title:'我是标题',id:'t1'}]，这样你在写tabpanel的时候就可以不用指定items，
而是直接从后台返回一个类似的字符串，再通过Ext.getCmp("容器ID").add(json);加载上去就可以了。顺便说一句：为什么CSDN论坛回贴那么卡呢，有时候切换个输入法都卡半天。
您好。。  您的方法 Ext.getCmp("容器ID").add(json);json  很好用  想请问下  如下我该如何加载指向页面的后台和JS代码？
这个写法是我在demo中找到的   我执行过程中发现后台和JS的代码都不会执行
     title: "实时曲线",
                                loader: {
                                    url: 'RealValue.aspx?name=' + name,
                                },
                                listeners: {
                                    activate: function (tabs) {
                                            tabs.loader.load();
                                    }
                                }
这个问题已经有点跑题了~~   不过还是很希望您能够回答