`
yautah
  • 浏览: 10252 次
  • 性别: Icon_minigender_1
文章分类
社区版块
存档分类
最新评论

extjs关于tab form的激活

阅读更多
extjs中使用了tab form
代码中关于tab部分的定义

items: {
            xtype:'tabpanel',
            deferredRender:false,//设为false,提交的时候才会提交所有tab里的field
            activeTab: 0,
            defaults:{autoHeight:true, bodyStyle:'padding:10px'}, 
            items:[{
                title:'基本信息',
                layout:'form',
                defaults: {width: 230},
                defaultType: 'textfield',

                items: [{
                    fieldLabel: '公司名称',
                    name: 'org_profile[name]'
                },new Ext.form.DateField({
                        fieldLabel: '成立日期',
                        name: 'org_profile[reg_on]',
                        width:190,
                        format:'Y-m-d'
                }),{
                    fieldLabel: '公司规模',
                    name: 'org_profile[guimo]'
                }, {
                    fieldLabel: '员工数量',
                    name: 'org_profile[employees_num]'
                }, {
                    fieldLabel: '公司主页',
                    name: 'org_profile[url]'
                }]
            },{
                title:'联系信息',
                layout:'form',
                defaults: {width: 230},
                defaultType: 'textfield',

                items: [{
                    fieldLabel: '公司地址',
                    name: 'org_profile[address]'
                },{
                    fieldLabel: '邮政编码',
                    name: 'org_profile[post_code]'
                },{
                    fieldLabel: '联系人',
                    name: 'org_profile[contact]'
                },{
                    fieldLabel: '联系电话',
                    name: 'org_profile[tel]'
                },{
                    fieldLabel: '传真号码',
                    name: 'org_profile[fax]'
                },{
                    fieldLabel: '电子邮件',
                    name: 'org_profile[email]'
                }]
            },{
                title:'附加信息',
                layout:'form',
                defaults: {width: 230},
                defaultType: 'textfield',

                items: [{
                    fieldLabel: '附加信息',
                    name: 'org_profile[desc]'
                }]
            }]


其中
activeTab: 0,

指定了form打开的时候默认激活第一个tab

那么,如何动态的去指定form render的时候激活哪个tab呢??
分享到:
评论
1 楼 fsdos 2008-08-11  
var tabs = new Ext.TabPanel({
    renderTo: Ext.getBody(),
    activeTab: 0,
    items: [{
        title: 'Tab 1',
        html: 'A simple tab'
    },{
        title: 'Tab 2',
        html: 'Another one'
    }]
});

或者使用setActiveTab( String/Panel tab ) : void
Sets the specified tab as the active tab. This method fires the beforetabchange event which can return false to cance...

相关推荐

    Extjs4 tab 基本选项卡及增删插入操作

    在这个“Extjs4 tab 基本选项卡及增删插入操作”的主题中,我们将深入探讨如何使用ExtJS 4来管理TabPanel的选项卡,包括创建、删除和插入操作。 首先,让我们了解TabPanel的基本配置和选项: 1. **创建TabPanel** ...

    extjs tab panel

    综上所述,这篇关于“ExtJS Tab Panel”的博客文章很可能详细讲解了如何创建、配置和操作Tab Panel,同时也可能涉及源码解析和开发工具的使用,帮助读者掌握ExtJS在构建多标签界面时的实践技巧。通过学习这些内容,...

    ExtJs 动态添加表单

    首先,我们要理解表单(Form)在ExtJS中的基本概念。表单是数据输入和验证的核心组件,可以包含各种字段类型,如文本框、下拉菜单、复选框等。这些字段可以通过`Ext.form.field.Field`基类进行扩展,每个字段都有其...

    Extjs做的treepanel+tab切换页

    在"Extjs 做的treepanel+tab切换页"这个项目中,我们主要关注的是如何利用ExtJS 3.2版本来创建一个具备折叠面板(Collapsible Panel)功能的树形视图(TreePanel),以及与之联动的选项卡(TabPanel)。这个设计允许...

    extjs4 grid(含form)

    extjs4 grid 包括form js代码

    Extjs4的FormPanel从后台load json数据的要点

    `Ext.form.Panel`是Extjs4提供的一个用于创建复杂表单的组件。它允许开发者构建包含多个输入字段、按钮以及其他交互元素的表单,并且提供了大量的功能来帮助处理表单数据,如验证、提交以及数据绑定等。 ### 二、...

    extjs点击右侧面板生成tab

    extjs点击右侧面板生成tab,面板是ul+li的

    extjs4 入门基础,form、grid、tree

    ExtJS 是一个强大的JavaScript 框架,专用于构建富客户端Web应用程序。它提供了一整套组件化的用户界面元素,包括表单(Form)、网格(Grid)、树形视图(Tree)等,使得开发者能够创建出功能丰富且交互性强的前端...

    Extjs4.2 设置tabpanel当前活动页签的样式

    其中, `.x-tab-active` 是Extjs中当前活动页签的CSS类名, `.x-tab-wrap` 是标签页签的容器, `.x-tab-button` 是标签页签的按钮, `.x-tab-inner` 是标签页签的内部容器。 在上面的代码中,我们使用了CSS选择器来...

    一个EXTJS的TAB组件实例

    一个关于TABS组件的EXT实例,帮助大家学习TAB控件和JS语言。。。

    Extjs4.2 根据不同的数值设置tabpanel行的背景颜色

    var tabPanel = Ext.create('Ext.tab.Panel', { width: 600, height: 300, items: [ { title: 'Value Table', layout: 'fit', items: Ext.create('MyApp.view.MyGrid') } ] }).render(Ext.getBody()); })...

    Extjs图片展示组件实例

    漂亮的Extjs图片展示组件实例,类似于幻灯片,可直接拿去用,非常不错的哦

    Extjs4--Form登录功能,结合struts2

    1. **异步提交**:使用ExtJS的`form.submit`方法,可以实现Ajax方式的表单提交,无需刷新整个页面。 2. **处理响应**:Struts2将返回JSON或XML格式的结果,ExtJS可以解析这些响应,根据返回的状态(成功或失败)更新...

    Extjs 关于 cookie的操作

    ### Extjs 中关于 Cookie 的操作 #### 一、引言 在 Web 开发中,Cookie 是一种常用的数据存储方式,用于保存用户的一些基本信息或者状态,从而实现网站的个性化设置或登录状态保持等功能。Extjs 作为一种强大的 ...

    解决EXTJS4.2的tabpanel右键关闭的BUG

    EXTJS4.2官网上的tabpanel的右键关闭当前页,关闭其它,关闭全部有一点小BUG。 修改TabCloseMenu.js文件的一下函数。 压缩文件里面就是修改过后的TabCloseMenu.js文件,只要替换当前4.2的那个文件就可以使用了!

    extJs3升级extjs4方案

    在 ExtJS4 中,API 也发生了很大的变化,包括 tree、tab panel、grid、window、form、chart、data stores、border layout 等等。这些变化使得大型应用程序迁移变得非常困难。 在 ExtJS3 中,我们可以使用 Ext....

    ExtJs获取表单元素的值

    在本篇文章中,我们将深入探讨如何在ExtJs框架中有效地获取表单元素的值,并结合提供的代码示例进行详细解析。对于前端开发者来说,掌握如何高效地操作表单元素是必不可少的一项技能,尤其是在使用像ExtJs这样的强大...

    extjs-Ext.ux.form.LovCombo下拉框

    至于"extjs"标签,这表明整个话题是关于EXTJS框架的,EXTJS是一个强大的JavaScript库,用于构建富客户端Web应用程序。它提供了丰富的组件库,包括表格、窗口、面板、菜单等,而`Ext.ux.form.LovCombo`就是EXTJS生态...

    Extjs学习笔记之二 初识Extjs之Form

    在本篇Extjs学习笔记中,我们将深入探讨Extjs中的Form,特别是其封装的Ext.form.BasicForm和Ext.form.FormPanel。 首先,Extjs中的表单组件主要基于Ext.form.BasicForm,这是一个基础的表单对象,负责处理表单数据...

Global site tag (gtag.js) - Google Analytics