pc_155 2010-08-07 01:12
浏览 269
已采纳

求教extjs问题:我想实现TabPanel加载的item页中加载新的item的问题

是这样的问题,不知道我能不能表达清楚。

先上个图

[img]http://dl.iteye.com/upload/attachment/289430/4031ffc4-9b09-31a8-9021-928b70c41bc8.gif[/img]

其实就是类似126邮件,在邮件列表中,点击一封邮件,跳转到另一个新的tabpanel中。

请问一下怎么实现的呢?

new Ext.TabPanel上的item是加载的一个新页面,我要在新页面上点击在父页上新加tabpanel.我真不知道怎么去定义,连搜索,我都不知道搜什么关键字。所以到这里来求教了。

  • 写回答

3条回答

  • works001 2010-08-07 07:35
    关注

    还有一种 通过ajax请求一个js的方式 实现新增一个tab页
    这里给出一个小例子
    [code="java"] if(!tabs.getItem(id)){
    Ext.Ajax.request({

    url:"<%=path%>/js/"+url,//这里是的请求那个js的具体地址 url稍微改一下
    success: function(response, opts){

    var obj = eval(response.responseText);
    obj.id=id,
    tabs.add(obj);

    tabs.setActiveTab(obj);
    tabs.doLayout();
    },
    failure : function(response, options) {
    Ext.Msg.alert("系统信息", "请求失败");
    }

    });
    }else{
    tabs.setActiveTab(tabs.getItem(node.id));
    }[/code]

    然后给出所请求的简单的一个js代码(代码简单 只是一个例子而已)
    code="java"{
    AccountUi = Ext.extend(Ext.form.FormPanel, {

    title: 'Account',

    labelWidth: 100,

    labelAlign: 'left',

    layout: 'form',

    width: 600,

    frame: true,

    initComponent: function() {

    this.items = [

    {

    xtype: 'container',

    autoEl: 'div',

    layout: 'column',

    items: [

    {

    xtype: 'container',

    autoEl: 'div',

    layout: 'form',

    columnWidth: 0.5,

    items: [

    {

    xtype: 'textfield',

    fieldLabel: 'First Name',

    anchor: '95%',

    name: 'fname',

    ref: '../../fname'

    },

    {

    xtype: 'datefield',

    fieldLabel: 'Birth of day',

    anchor: '95%',

    name: 'birthday',

    ref: '../../birthday'

    }

    ]

    },

    {

    xtype: 'container',

    autoEl: 'div',

    layout: 'form',

    columnWidth: 0.5,

    items: [

    {

    xtype: 'textfield',

    fieldLabel: 'Last Name',

    anchor: '95%',

    name: 'lname',

    ref: '../../lname'

    },

    {

    xtype: 'combo',

    fieldLabel: 'Sex',

    anchor: '95%',

    name: 'sex',

    ref: '../../sex'

    }

    ]

    }

    ]

    },

    {

    xtype: 'htmleditor',

    anchor: '98%',

    fieldLabel: 'Memo',

    height: 150,

    width: 300,

    name: 'memo',

    ref: 'memo'

    }

    ];

    this.fbar = {

    xtype: 'toolbar',

    items: [

    {

    xtype: 'button',

    text: 'Save',

    ref: '../saveBtn'

    },

    {

    xtype: 'button',

    text: 'Reset',

    ref: '../resetBtn'

    }

    ]

    };

    AccountUi.superclass.initComponent.call(this);

    }

    });

    Account = Ext.extend(AccountUi, {

    initComponent: function() {

    Account.superclass.initComponent.call(this);

        this.saveBtn.on('click', this.doSaveAction, this);   
    },   
    doSaveAction:  function() {   
        alert(this.fname.getValue());   
    }   
    

    });

    var account = new Account();

       return  new Ext.Panel({   //这个js返回的东西
                    draggable: false,
                    closable:true,
                    items:[account],
           });  
    

    })() //匿名函数
    [/code]

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 MATLAB动图问题
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名