Skip to content
WebBuilder 文档

Ext.form.field.Text

xtype 为 textfield 的 Ext JS 原生组件参考。

Updated View as Markdown

源码定义：ext-all-debug.js:94394。分类：表单与字段。

创建示例

var component = Ext.create("Ext.form.field.Text", {
  xtype: "textfield",
  allowBlank: true,
  allowOnlyWhitespace: true,
  ariaRole: 'textbox',
  blankText: 'This field is required',
  renderTo: Ext.getBody()
});

属性

属性 类型 默认值 说明 配置示例
allowBlank Boolean true 控制字段是否允许为空。 allowBlank: true
allowOnlyWhitespace Boolean true 控制是否启用 allowOnlyWhitespace 行为。 allowOnlyWhitespace: true
ariaRole String 'textbox' 组件在辅助技术中的 ARIA 角色。 ariaRole: 'textbox'
blankText String 'This field is required' 配置组件的 blankText 选项。 blankText: 'This field is required'
componentLayout String 'textfield' 组件采用的内部布局策略。 componentLayout: 'textfield'
emptyCls Mixed Ext.baseCSSPrefix + 'form-empty-field' 配置 emptyCls 对应的 CSS 类名。 emptyCls: Ext.baseCSSPrefix + 'form-empty-field'
growAppend String 'W' 配置组件的 growAppend 选项。 growAppend: 'W'
growMax Number 800 配置组件的 growMax 选项。 growMax: 800
growMin Number 30 配置组件的 growMin 选项。 growMin: 30
labelAlign String "right" 字段标签相对输入区域的对齐位置。 labelAlign: "right"
labelWidth Number 80 字段标签区域的宽度。 labelWidth: 80
maxLength Mixed Number.MAX_VALUE 配置 maxLength 限制值。 maxLength: Number.MAX_VALUE
maxLengthText String 'The maximum length for this field is {0}' 配置 maxLengthText 限制值。 maxLengthText: 'The maximum length for this field is {0}'
minLength Number 0 配置 minLength 限制值。 minLength: 0
minLengthText String 'The minimum length for this field is {0}' 配置 minLengthText 限制值。 minLengthText: 'The minimum length for this field is {0}'
regexText String '' 配置组件的 regexText 选项。 regexText: ''
requiredCls Mixed Ext.baseCSSPrefix + 'form-required-field' 配置 requiredCls 对应的 CSS 类名。 requiredCls: Ext.baseCSSPrefix + 'form-required-field'
size Number 20 配置组件的 size 选项。 size: 20
validateBlank Boolean false 控制是否启用 validateBlank 行为。 validateBlank: false
valueContainsPlaceholder Boolean false 控制是否启用 valueContainsPlaceholder 行为。 valueContainsPlaceholder: false

方法

方法 参数 说明 调用示例
initComponent `` 初始化组件及其子项。 执行时会保留父类默认行为、更新 allowBlank、fieldCls 状态。源码涉及 callParent()、addEvents()、addStateEvents()、setGrowSizePolicy()。 component.initComponent()
setGrowSizePolicy `` 设置 growSizePolicy。 component.setGrowSizePolicy()
initEvents `` 初始化 events。 执行时会保留父类默认行为、更新 maskRe 状态。源码涉及 callParent()、mon()。 component.initEvents()
isEqual value1, value2 判断 equal 状态。源码涉及 isEqualAsString()。 component.isEqual(...)
onChange newVal, oldVal 处理 change 回调。 执行时会保留父类默认行为。源码涉及 callParent()、autoSize()。 component.onChange(...)
getSubTplData `` 读取并返回 subTplData。 执行时会保留父类默认行为、更新 valueContainsPlaceholder 状态。源码涉及 getRawValue()、callParent()。 component.getSubTplData()
afterRender `` 生成 after 的渲染结果。 执行时会保留父类默认行为。源码涉及 autoSize()、callParent()。 component.afterRender()
onMouseDown e 处理 mouseDown 回调。源码涉及 mon()。 component.onMouseDown(...)
processRawValue value 处理 rawValue。 执行时会更新组件值。源码涉及 setRawValue()。 component.processRawValue(...)
onDisable `` 处理 disable 回调。 执行时会保留父类默认行为。源码涉及 callParent()。 component.onDisable()
onEnable `` 处理 enable 回调。 执行时会保留父类默认行为。源码涉及 callParent()。 component.onEnable()
onKeyDown e 处理 keyDown 回调。 执行时会派发 keydown 事件。源码涉及 fireEvent()。 component.onKeyDown(...)
onKeyUp e 处理 keyUp 回调。 执行时会派发 keyup 事件。源码涉及 fireEvent()。 component.onKeyUp(...)
onKeyPress e 处理 keyPress 回调。 执行时会派发 keypress 事件。源码涉及 fireEvent()。 component.onKeyPress(...)
reset `` 将组件恢复为初始状态。 执行时会保留父类默认行为。源码涉及 callParent()、applyEmptyText()。 component.reset()
applyEmptyText `` 应用 emptyText。 执行时会更新组件值、更新 valueContainsPlaceholder 状态。源码涉及 getRawValue()、setRawValue()、autoSize()。 component.applyEmptyText()
afterFirstLayout `` 在 firstLayout 后执行后处理。 执行时会保留父类默认行为。源码涉及 callParent()。 component.afterFirstLayout()
beforeFocus `` 在 focus 前执行预处理。 执行时会保留父类默认行为、更新组件值、更新 valueContainsPlaceholder、inputFocusTask 状态。源码涉及 callParent()、setRawValue()、focusInput()。 component.beforeFocus()
focusInput `` 将焦点移动到 input。 component.focusInput()
onFocus `` 处理 focus 回调。 执行时会保留父类默认行为。源码涉及 callParent()、autoSize()。 component.onFocus()
postBlur `` 执行后续处理 blur。 执行时会保留父类默认行为。源码涉及 callParent()、applyEmptyText()。 component.postBlur()
filterKeys e 处理 filterKeys 操作。 component.filterKeys(...)
getState `` 读取并返回 state。 执行时会保留父类默认行为。源码涉及 addPropertyToState()、callParent()。 component.getState()
applyState state 应用 state。 执行时会保留父类默认行为、更新组件值。源码涉及 callParent()、setValue()。 component.applyState(...)
getRawValue `` 读取并返回 rawValue。 执行时会保留父类默认行为。源码涉及 callParent()。 component.getRawValue()
setValue value 设置 value。 执行时会保留父类默认行为、更新 valueContainsPlaceholder 状态。源码涉及 callParent()、applyEmptyText()。 component.setValue(...)
getErrors value 读取并返回 errors。 执行时会保留父类默认行为。源码涉及 callParent()、processRawValue()、getRawValue()。 component.getErrors(...)
selectText start, end 选中 text。源码涉及 getRawValue()、focus()。 component.selectText(...)
autoSize `` 自动计算尺寸当前组件。 执行时会刷新界面或布局、更新 autoSizing 状态。源码涉及 updateLayout()。 component.autoSize()
afterComponentLayout `` 在 componentLayout 后执行后处理。 执行时会保留父类默认行为、派发 autosize 事件、更新 lastInputWidth 状态。源码涉及 callParent()、fireEvent()。 component.afterComponentLayout()
onDestroy `` 处理 destroy 回调。 执行时会保留父类默认行为、更新 inputFocusTask 状态。源码涉及 callParent()。 component.onDestroy()

事件

事件 说明 监听示例
autosize 组件根据内容自动调整尺寸后触发。 源码在 afterComponentLayout() 中通过 fireEvent() 触发。 listeners: { autosize: function () {} }
keydown 用户按下按键时触发。 源码在 onKeyDown() 中通过 fireEvent() 触发。 listeners: { keydown: function () {} }
keypress 用户输入字符按键时触发。 源码在 onKeyPress() 中通过 fireEvent() 触发。 listeners: { keypress: function () {} }
keyup 用户松开按键时触发。 源码在 onKeyUp() 中通过 fireEvent() 触发。 listeners: { keyup: function () {} }
Navigation

Type to search…

↑↓ navigate↵ selectEsc close