Thank you very much for your prompt response. I'll give it a try and report back.
Printable View
Thank you very much for your prompt response. I'll give it a try and report back.
and image help text ;-)
Code:Ext.ux.FieldHelp = Ext.extend(Object, (function(){
function afterFieldRender() {
if (this.helpText) {
if (this.getEl().up('div.x-form-item')) {
var helpImage = this.getEl().up('div.x-form-item').child('label').createChild({
tag: 'img',
src: '../media/ico/help.png',
style: 'margin-bottom:0px; margin-left:5px; padding:0px;'
});
Ext.QuickTips.register({
target: helpImage,
title: '',
text: this.helpText,
enabled: true
});
}
}
}
return {
constructor: function(t) {
this.helpText = t;
},
init: function(f) {
f.helpText = this.helpText;
f.afterRender = f.afterRender.createSequence(afterFieldRender);
}
};
})());
Hello Animal,
thanks for the great plugin. Anyway, i still have a display problem with comboboxes in ExtJS 3.0.3. The dropdown list is rendered below the help text (see attached image).
I fixed this using the following code, but i do not like it personally because it is not generic. I assume there is a much more elegant way to do that, but i'm not a HTML/JS specialist. Any tipps?
Code:function afterFieldRender() {
var node = null;
if (this.getXType() == "combo") {
node = this.container;
} else {
if (!this.wrap) {
this.wrap = this.el.wrap({cls: 'x-form-field-wrap'});
this.positionEl = this.resizeEl = this.wrap;
this.actionMode = 'wrap';
this.onResize = this.onResize.createSequence(syncInputSize);
}
node = this.wrap;
}
node[this.helpAlign == 'top' ? 'insertFirst' : 'createChild']({
cls: 'x-form-helptext',
html: this.helpText
});
}
You got the latest code which aligns the list with the input el rather than the wrap el?
> You got the latest code which aligns the list with the input el rather than the wrap el?
I use the code from your first post.
You need to look at your source for ComboBox.js, and add an override based on http://www.extjs.com/forum/showthrea...489#post377489
That fix is applied in SVN and will be available in 3.1.1
You can pass helpText as a config option for the field and use Ext.preg if you change the init to this:
add the Ext.preg at the end of the file:PHP Code:
init : function(f) {
f.helpAlign = this.align;
if ('object' != typeof this.helpText)
f.helpText = this.helpText;
f.afterRender = f.afterRender.createSequence(afterFieldRender);
}
Then you can create the field like this:PHP Code:
Ext.preg('fieldHelp', Ext.ux.FieldHelp);
or:PHP Code:
new Ext.form.TextField ({
name: 'username',
fieldLabel: 'User Name',
helpText: 'Users Full Name',
plugins: [ 'fieldHelp' ]
});
PHP Code:
new Ext.form.TextField ({
name: 'username',
fieldLabel: 'User Name',
plugins: [ new Ext.ux.FieldHelp('Users Full Name') ]
});
Hi Animal,
After I create a combo with the Field Help plugin I can see the help text show below the combo. If I have to change the help text based on the combo selection, how can I get access to the Help Text element. I tried combo.getEl().child('x-form-helptext') and could not get it.
Appreciate your help.
Thanks,
Hi Animal,
With regards to my earlier question, I figured it out. I modified the line in your plugin code as below and getting a reference to the wrapped element (helpText) like:
this.helpEl = this.wrap[this.helpAlign == 'top' ? 'insertFirst' : 'createChild']({
cls: 'x-form-helptext',
html: this.helpText
});
and I am accessing it like p_combo.helpEl.update('New text'). Now I am able to change the text. If you consider this a wrong way to do let me know. For now it is working for me.
Thanks,