您的位置:首页 > Web前端 > HTML

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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息