`
韩悠悠
  • 浏览: 839716 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

Ext.form.FormPanel

阅读更多

1、layout : String 

此容器所使用的布局类型。如不指定,则使用缺省的Ext.layout.ContainerLayout类型。 当中有效的值可以是:accordion、anchor、border、cavd、column、fit、form和table。 针对所选择布局类型,可指定#layoutConfig进一步配置。

 

2、layoutConfig : Object 

选定好layout布局后,其相应的配置属性就在这个对象上进行设置。 (即与#layout配置联合使用)有关不同类型布局有效的完整配置信息,参阅对应的布局类:

Ext.layout.Absolute 

Ext.layout.Accordion 

Ext.layout.AnchorLayout 

Ext.layout.BorderLayout 

Ext.layout.CardLayout 

Ext.layout.ColumnLayout 

Ext.layout.FitLayout 

Ext.layout.FormLayout 

Ext.layout.TableLayout

 

3、bufferResize : Boolean/Number 

当设置为true(100毫秒)或输入一个毫秒数,为此容器所分配的布局会缓冲其计算的频率和缓冲组件的重新布局。如容器包含大量的子组件或这样重型容器,在频繁进行高开销的布局时,该项尤为有用。

 

4、activeItem : String/Number 

组件id的字符串,或组件的索引,用于在容器布局渲染时候的设置为活动。例如,activeItem: 'item-1'或activeItem: 0 index 0 = 容器集合中的第一项)。只有某些风格的布局可设置activeItem(如Ext.layout.Accordion、Ext.layout.CardLayout和 Ext.layout.FitLayout),以在某个时刻中显示一项内容。相关内容请参阅Ext.layout.ContainerLayout#activeItem。 

 

5、items : Mixed 

一个单独项,或子组件组成的数组,加入到此容器中。 每一项的对象类型是基于Ext.Component的

你可传入一个组件的配置对象即是lazy-rendering的做法,这样做的好处是组件不会立即渲染,减低直接构建组件对象带来的开销。 要发挥"lazy instantiation延时初始化"的特性,应对组件所属的登记类型的Ext.Component#xtype属性进行配置。

 

要了解所有可用的xtyps,可参阅Ext.Component。如传入的单独一个项,应直接传入一个对象的引用( 如items: {...})。多个项应以数组的类型传入(如items: [{...}, {...}])。

 

6、defaults : Object 

应用在全体组件上的配置项对象,无论组件是由#items指定,抑或是通过#add、#insert的方法加入,都可支持。 缺省的配置可以是任意多个容器能识别的“名称/值”, 假设要自动为每一个Ext.Panel项设置padding内补丁,你可以传入defaults: {bodyStyle:'padding:15px'}。

 

7、autoDestroy : Boolean 

若为true容器会自动销毁容器下面全部的组件,否则的话必须手动执行销毁过程(默认为true)。 

 

8、hideBorders : Boolean 

True表示为隐藏容器下每个组件的边框,false表示保留组件现有的边框设置(默认为false)。

 

9、defaultType : String 

容器的默认类型,用于在Ext.ComponentMgr中表示它的对象。(默认为'panel')

 

10、x : Number 

如果该组件是在一个定位的组件之中,可通过该属性返回组件的x本地(左边)坐标。 

 

11、y : Number 

如果该组件是在一个定位的组件之中,可通过该属性返回组件的y本地(顶部)坐标。 

 

12、pageX : Number 

如果该组件是在一个定位的组件之中,可通过该属性返回组件的x页面坐标。 

 

13、pageY : Number 

如果该组件是在一个定位的组件之中,可通过该属性返回组件的y页面坐标。 

 

14、height : Number 

此组件的高度(单位象素)(缺省为auto)。

 

15、width : Number 

此组件的宽度(单位象素)(缺省为auto)。 

 

16、autoWidth : Boolean 

True表示为使用width:'auto',false表示为使用固定宽度(缺省为false)。 注意:尽管许多组件都会继承该配置选项,但是不是全部的'auto' width都有效。 autoWidth:true的设定表示会依照元素内容自适应大小,Ext就不会过问宽度的问题。 

 

17、fieldLabel : String 

在组件旁边那里显示的label文本(默认为'')。 

此组件只有在Ext.form.FormLayout FormLayout布局管理器控制的容器下渲染才有用。 

 

18、labelStyle : String 

关于表单字段的label提示文本的CSS样式的“完全表达式(CSS style specification)”。默认为"",若容器的lableStyle有设置这样设置值。

此组件只有在Ext.form.FormLayout FormLayout布局管理器控制的容器下渲染才有用。                      

 

19、labelSeparator : String 

分隔符,就是每行表单中的label文本显示后面紧接着的那个分隔符(默认值是Ext.layout.FormLayout#labelSeparator,即缺省是分号“:”)。 如果指定空白字符串""就表示不显示所谓的“分隔符”。

此组件只有在Ext.form.FormLayout FormLayout布局管理器控制的容器下渲染才有用。 

 

20、hideLabel : Boolean 

True表示为完全隐藏label元素。默认下,即使你不指定fieldLabel都会有一个空白符插入,好让支撑field为一行。 设该值为true就不会有这个空白符了。 

此组件只有在Ext.form.FormLayout FormLayout布局管理器控制的容器下渲染才有用。 

 

21、clearCls : String 

关于field的清除样式(默认为“x-form-clear-left”)。

此组件只有在Ext.form.FormLayout FormLayout布局管理器控制的容器下渲染才有用。

 

22、id : String  

唯一的组件id(默认为自动分配的id)。 出于你打算用id来获取组件引用这一目的(像使用Ext.ComponentMgr#getCmp的情形),你就会送入一个你写好的id到这个方法。 提示:容器的元素即HTML元素也会使用该id渲染在页面上。如此一来你就可以采用CSS id匹配的规则来定义该组件的样式。 换句话说,实例化该组件时,送入不同的Id,就有对应不同的样式效果。

 

23、xtype : String 

用于登记一个xtype。

 

24、cls : String 

一个可选添加的CSS样式类,加入到组件的元素上(默认为'')。这为组件或组件的子节点加入标准CSS规则提供了方便。

 

25、overCls : String 

关于鼠标上移至该组件元素的CSS样式类,移出时撤销该样式的效果(默认为'')。该配置项在处理元素"active"或"hover"的时候很有用。 

 

26、style : String 

作用在组件元素上特定的样式。该值的有效格式应如Ext.Element#applyStyles。 

 

27、ctCls : String 

一个可选添加的CSS样式类,加入到组件的容器上(默认为'')。这为容器或容器的子节点加入标准CSS规则提供了方便。

 

28、hidden : Boolean 

渲染该组件为隐藏状态的(默认为false)

 

29、plugins : Object/Array 

针对该组件自定义的功能,是对象或这些对象组成的数组。一个有效的插件须保证带有一个init的方法以便接收属于Ext.Component类型的引用。当一个组件被创建后,若发现由插件可用,组件会调用每个插件上的init方法,传入一个应用到插件本身。这样,插件便能按照组件所提供的功能,调用到组件的方法或响应事件。 

 

30、renderTo : Mixed 

容器渲染的那个节点的id,或是DOM节点,又或者是与DIV相当的现有元素。 使用了这项配置后,不需要执行render()的方法。

 

31、stateful : Boolean 

组件记忆了一个状态信息,启动时候就根据这个标记获取状态信息。 组件必须设置其#stateId或#id,较有保障性, 而自动生成的id在跨页面加载的时候则不能保证一定不出现相同的情形。

为了能记忆状态,必须通过方法设置一个Ext.state.Provider的实例置于一个状态管理器之中, 然后才可以用Ext.state.Provider#set set与Ext.state.Provider#get get的方法,保存记忆和提取记忆。 可用内建的Ext.state.CookieProvider实现设置一个。

 

要设置页面的状态供应器: To set the state provider for the current page: 

 

32、stateId : String 

出于状态管理目的id,(默认是人为设置过的组件id,如果组件是自动生成的id那种那么该项是null。 参阅#stateful了解记忆与复原的机制。

 

33、autoEl : Mixed 

某种标签的字符串或者Ext.DomHelper DomHelper配置对象,用于创建承载此组件的元素。

一般而言你无须对其设置。对于这些基础类而言,就会使用div作为其默认的元素。 Ext类写得越复杂,组件的onRender方法产生的DOM结构就随之更为复杂。

该项是为创建形形色色的DOM元素而准备的,开发者可根据程序的特定要求去制定,如:

 

34、disabledClass : String 

当组件被禁用时作用的CSS样式类(默认为"x-item-disabled")。

 

35、allowDomMove : Boolean 

当渲染进行时能否移动Dom节点上的组件(默认为true)。

 

36、autoShow : Boolean 

True表示为在渲染的时候先检测一下有否关于隐藏的样式类(如:'x-hidden'或'x-hide-display'),有就移除隐藏的样式类(缺省为false)。 

 

37、hideMode : String 

这个组件是怎么隐藏的。可支持的值有"visibility" (css中的visibility),"offsets"(负偏移位置)和"display"(css中的display)-默认为“display”。 

容器可能是{@link Ext.layout.CardLayout card layout}或Ext.TabPanel TabPanel中的一员,会有隐藏/显未的情形,这种情形下最好将其hideMode模式设为"offsets"。这保证了计算布局时,组件仍有正确的高度和宽度,组件管理器才能顺利地测量。

 

38、hideParent : Boolean 

True表示为当隐藏/显示组件时对组件的容器亦一同隐藏/显示,false就只会隐藏/显示组件本身(默认为false)。例如,可设置一个hide:true的隐藏按钮在window,如果按下就通知其父容器一起隐藏,这样做起来比较快捷省事。 

 

39、listeners : Object 

 

公共事件事件  

1、clientvalidation( Ext.form.FormPanel this, Boolean valid ) 

2、

如果配置项monitorValid为true,那么为通知验证的状态(valid state)该事件将不断地触发。

侦听器会传入以下的参数:

this : Ext.form.FormPanel 

valid : Boolean 

如果客户端验证都通过的话传入一个true 

  

3、bodyresize( Ext.Panel p, Number width, Number height ) 

当面板的大小变化后触发。 

侦听器会传入以下的参数:

p : Ext.Panel 调节大小的面板。

width : Number 面板新宽度。

height : Number 面板新高度。

 

4、titlechange( Ext.Panel p, String t ) 

面板的标题有改动后触发。 

侦听器会传入以下的参数:

p : Ext.Panel 标题被改动的那个面板。

t : String 新标题。

 

5、iconchange( Ext.Panel p, String n, String o ) 

当面板的图标类设置了或改变了触发。 

侦听器会传入以下的参数:

p : Ext.Panel 图标类被改动的那个面板。

n : String 新图标类。

o : String 旧图标类

 

6、collapse( Ext.Panel p ) 

当面板被闭合后触发。 

侦听器会传入以下的参数:

p : Ext.Panel 闭合的那个面板

 

7、expand( Ext.Panel p ) 

当面板被展开后触发。

侦听器会传入以下的参数:

p : Ext.Panel 展开的面板。

 

8、beforecollapse( Ext.Panel p, Boolean animate ) 

当面板被闭合之前触发。若句柄返回false则取消闭合的动作。

侦听器会传入以下的参数:

p : Ext.Panel 正被闭合的面板。

animate : Boolean True表示闭合时带有动画效果。

 

9、beforeexpand( Ext.Panel p, Boolean animate ) 

当面板被展开之前触发。若句柄返回false则取消展开的动作。

侦听器会传入以下的参数:

p : Ext.Panel 正被展开的面板

animate : Boolean True表示闭合时带有动画效果。

 

10、beforeclose( Ext.Panel p ) 

当面板被关闭之前触发。 注意面板不直接支持“关闭”,不过在面板的子类(如Ext.Window)可支持即可调用该事件。 若句柄返回false则取消关闭的动作。

侦听器会传入以下的参数:

p : Ext.Panel 正被关闭的面板。

 

11、close( Ext.Panel p ) 

当面板被关闭后触发。 注意面板不直接支持“关闭”,不过在面板的子类(如Ext.Window)可支持即可调用该事件。 

侦听器会传入以下的参数:

p : Ext.Panel 已关闭的面板。

 

12、activate( Ext.Panel p ) 

当面板视觉上取消活动后触发。 注意面板不直接支持“取消活动”,不过在面板的子类(如Ext.Window)可支持即可调用该事件。 另外在TabPanel控制下子组件也会触发activate和deactivate事件。 

侦听器会传入以下的参数:

p : Ext.Panel 激活的面板。

 

13、deactivate( Ext.Panel p ) 

当面板视觉上“反激活”过后触发。 注意面板不直接支持“反激活”,但面板某些子类就支持(如Ext.Window)。 TabPanel控制其子面板的激活与反激活事件。

侦听器会传入以下的参数:

p : Ext.Panel 已反激活的面板。

分享到:
评论

相关推荐

    EXT.form组件

    1. `form`:`Ext.FormPanel`是EXT JS中的表单面板,它是一个容器,可以容纳各种表单字段和其他组件。表单面板允许你定义布局、提交行为以及处理表单数据的方法。 2. `checkbox`:`Ext.form.Checkbox`是用于创建复选...

    Ext 添加功能form表单实例

    在这个例子中,通过`new Ext.FormPanel`来创建了一个表单面板,并设置了一些关键属性: - `frame`: 设置为`true`,表示表单周围有一个边框。 - `width` 和 `height`: 分别设置了表单的宽度和高度。 - `layout`: ...

    ExtJs_xtype一览

    - `form`:`Ext.FormPanel` 或 `Ext.form.FormPanel`,用于创建表单的容器。 - `checkbox`:`Ext.form.Checkbox`,多选框组件。 - `combo`:`Ext.form.ComboBox`,下拉选择框。 - `datefield`:`Ext.form....

    Ext组件描述,各个组件含义

    **2.16 Form Panel (Ext.FormPanel)** - **xtype**: `form` - **功能描述**:Form Panel 是一个包含表单字段的面板。 - **主要用途**:用于创建和管理表单,支持数据验证和提交。 **2.17 Checkbox (Ext.form....

    Ext.FormPanel 提交和 Ext.Ajax.request 异步提交函数的区别

    (1)Ext.FormPanel f.getForm().submit({ url:”……”, params:{ XX:xx …..} success: function (c,v,e) { //e: 触发事件 var json=Ext.decode(v.response.responseText); }, failure:function(c,v,e){} }) (2)Ext....

    ExtJs组件类的对应表

    1. **`form`** - `Ext.FormPanel`或`Ext.form.FormPanel`,表单面板组件,用于创建表单并管理其字段。 2. **`checkbox`** - `Ext.form.Checkbox`,多选框组件,用于创建多选输入。 3. **`combo`** - `Ext.form....

    ext 的ppt ext 的ppt ext 的pptext 的pptext 的ppt

    var form = new Ext.form.FormPanel({ title: ' 用户登录 ', frame: true, items: [textfield], renderTo: document.body }); ``` 方法二是直接在FormPanel配置中定义items,像这样: ```javascript var form ...

    extJs xtype 类型

    1. **`form`:** 表单面板组件,用于创建表单,通过`Ext.FormPanel/Ext.form.FormPanel`类实现。 2. **`checkbox`:** 多选框组件,通过`Ext.form.Checkbox`类实现。 3. **`combo`:** 下拉框组件,用于创建下拉列表...

    ExtJs xtype一览

    - **`form` (Ext.FormPanel/Ext.form.FormPanel)**: 表单面板组件,用于创建包含多个表单元素的表单。 - **`checkbox` (Ext.form.Checkbox)**: 多选框组件,用于实现多选功能。 - **`combo` (Ext.form.ComboBox)**: ...

    EXT3.2 多选下拉框

    var formPanel = new Ext.form.FormPanel({ items: [multiSelectComboBox], renderTo: Ext.getBody() }); ``` 在上述代码中,我们创建了一个JSON数据存储,并将其与ComboBox关联。设置`multiSelect: true`后,...

    struts+extjs实现UploadDialog

    为了创建一个UploadDialog,你可以使用`Ext.window.Window`或`Ext.container.Viewport`来创建一个弹出窗口,里面包含一个`Ext.form.FormPanel`,并在其中添加`FileField`。当用户选择文件并点击提交按钮时,ExtJS会...

    ext学习资料ext学习资料

    Form组件,即`Ext.form.FormPanel`,用于创建和管理表单数据。它可以包含各种输入控件,如文本字段、复选框、下拉列表等。表单数据可以方便地提交到服务器,或者与数据存储进行双向绑定。下面是一个创建简单表单的...

    Ext form_load

    在Ext JS中,`Ext.form_load`涉及到的主要知识点是FormPanel的数据加载机制,这包括了对FormPanel的form对象、BasicForm、doAction方法、Ext.form.Action对象以及JsonReader的使用。以下是对这些概念的详细解释: 1...

    extjs的spinner

    Ext.create('Ext.form.FormPanel', { title: 'Form with Spinner Field', bodyPadding: 5, width: 350, renderTo: Ext.getBody(), items: [{ xtype: 'customspinner', fieldLabel: 'How Much Beer?', step: ...

    Ext 3.x 文件批量上传

    在Ext中,我们可以使用`Ext.form.FormPanel`来定义表单,并通过`Ext.form.FileField`(也称为`FileUploadField`)添加文件选择功能。此字段允许用户选择一个或多个文件,并触发上传操作。 `说明.txt`文件可能包含了...

    Extjs xtype集合

    - **`Class`**: `Ext.FormPanel/Ext.form.FormPanel` - **描述**: 表单面板,用于组织表单字段。 2. **`checkbox`:** - **`xtype`**: `checkbox` - **`Class`**: `Ext.form.Checkbox` - **描述**: 复选框组件...

    Ext3.0 api帮助文档

    - **Ext.form.FormPanel**: 创建表单的容器,支持多种表单元素和验证。 - **Ext.form.Field**: 表单字段类,如文本框、选择框、日期选择器等。 - **Ext.form.BasicForm**: 提供表单的提交和数据验证功能。 7. **...

    extjs属性方法大全

    `Ext.form.FormPanel` 是一个包含表单元素的面板容器。 - **属性:** - `items`: 表单中的子项列表。 - `buttons`: 底部按钮列表。 - `buttonAlign`: 按钮对齐方式,默认为居中。 - `labelWidth`: 标签宽度。 ...

Global site tag (gtag.js) - Google Analytics