[img]http://dl2.iteye.com/upload/attachment/0094/6761/a5c47a3f-aec6-3e81-8b9f-563b462ffee5.png[/img]
方法1:在items中加*号
方法2:覆写onRender方法并添加个sideText属性,并定义样式x-form-sideText
定义style:
示例:
方法3:
方法1:在items中加*号
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" color="red">*</font>'
}]
}]
}]
})
方法2:覆写onRender方法并添加个sideText属性,并定义样式x-form-sideText
/**
* 适用于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:
<style>
.x-form-sideText {
padding-left: 2px;
display: inline-block;
display: inline;
}
</style>
示例:
var shortName = new Ext.form.TextField({
fieldLabel : '客户简称',
name : 'shortName',
allowBlank : false,
blankText : '客户简称不能为空',
sideText : '<font color=red>*</font>',
width : 100
});
方法3:
{
fieldLabel: '用户名',
xtype: 'textfield',
name: 'userName',
width:200,
id: 'userName',
listeners : {
render:function(config){
$("#"+config.id).after("<font id='font_"+config.id+"' color='red' > *</font>");
$("#font_"+config.id).after("<span id='span_"+config.id+"' style='color:red;'></span>");
}
}
}
,
{
fieldLabel: '用户名',
xtype: 'textfield',
name: 'u2',
xtype:'trigger',
triggerClass:'x-form-search-trigger',
cls:'ux-readOnly',
width:200,
id: 'u2',
listeners : {
render:function(config){
$("#"+config.id+" + img").after("<font id='font_"+config.id+"' color='red' style='padding-left:16px;'> *</font>");
$("#font_"+config.id).after("<span id='span_"+config.id+"' style='color:red;'></span>");
}
}
}