Ext form输入框后加文字说明(二)
2011-06-16 12:16
543 查看
方法1:在items中加*号
Js代码
var shortName = new Ext.form.TextField({ fieldLabel : '客户简称', name : 'shortName', allowBlank : false, blankText : '客户简称不能为空', width : 100 }); var formPanel = new Ext.form.FormPanel({ layout : 'table', layoutConfig : { columns : 3 }, items : [{ layout : 'form', items : [{ layout : 'table', items : [{ layout : 'form', items : [shortName] }, { html : '<font id="noFont" class="x-form-item" style="padding-left:1px" mce_style="padding-left:1px" color="red">*</font>' }] }] }] })
方法2:覆写onRender方法并添加个sideText属性,并定义样式x-form-sideText
Js代码
/** * 适用于TextField、NumberField(转自互联网) */ Ext.override(Ext.form.TextField, { sideText : '', onRender : function(ct, position) { Ext.form.TextField.superclass.onRender.call(this, ct, position); if (this.sideText != '' && !this.triggerAction) { this.sideEl = ct.createChild({ tag : 'div', html : this.sideText }); this.sideEl.addClass('x-form-sideText'); } } }); /** * 适用于ComboBox */ Ext.override(Ext.form.ComboBox, { sideText : '', onRender : function(ct, position) { Ext.form.ComboBox.superclass.onRender.call(this, ct, position); if (this.sideText != '') { this.sideEl = ct.first('div').createChild({ tag : 'div', style : 'padding-left: 19px; ', html : this.sideText }); this.sideEl.addClass('x-form-sideText'); } if (this.hiddenName) { this.hiddenField = this.el.insertSibling({ tag : 'input', type : 'hidden', name : this.hiddenName, id : (this.hiddenId || this.hiddenName) }, 'before', true); // prevent input submission this.el.dom.removeAttribute('name'); } if (Ext.isGecko) { this.el.dom.setAttribute('autocomplete', 'off'); } if (!this.lazyInit) { this.initList(); } else { this.on('focus', this.initList, this, { single : true }); } } });
定义style:
Html代码
<mce:style><!-- .x-form-sideText { padding-left: 2px; display: inline-block; display: inline; } --></mce:style><style mce_bogus="1"> .x-form-sideText { padding-left: 2px; display: inline-block; display: inline; } </style>
示例:
Js代码
var shortName = new Ext.form.TextField({ fieldLabel : '客户简称', name : 'shortName', allowBlank : false, blankText : '客户简称不能为空', sideText : '<font color=red>*</font>', width : 100 });
原文链接:http://fireinjava.iteye.com/blog/665258
相关文章推荐
- Ext文本输入框:Ext.form.TextField属性汇总(转) (
- Ext.form.FormPanel定义的参数说明
- Ext.form.field.Number数字输入框
- Ext_基本文本输入框_Ext.form.TextField(转)
- Ext文本输入框:Ext.form.TextField属性汇总
- [ext]form.submit()相关说明
- 版本生成|Ext form输入框后加文字说明
- Ext.form.DateField控件属性说明
- Ext.form.FormPanel定义的参数说明
- 重写ext的TextField控件,增加鼠标悬浮提示和控件后加说明文字
- Ext_基本文本输入框_Ext.form.TextField
- (11)ExtJS之Ext.form.field.Number数字输入框
- Ext_多行文本输入框_Ext.form.TextArea
- Ext_数字输入框_Ext.form.NumberField
- Ext文本输入框:Ext.form.TextField属性汇总
- ExtJS之Ext.form.field.Number数字输入框
- Ext.form.FormPanel定义的参数说明
- Form里面怎么添加中文文字说明啊?
- Ext.net文本输入框:Ext.form.TextField属性汇总
- Ext.form.FormPanel定义的参数说明