Page 3 of 4 FirstFirst 1234 LastLast
Results 21 to 30 of 39

Thread: Field help text plugin.

  1. #21
    Sencha User
    Join Date
    Nov 2008
    Location
    Currently Mexico
    Posts
    133
    Vote Rating
    0
      0  

    Default

    Thank you very much for your prompt response. I'll give it a try and report back.

  2. #22
    Sencha User demon222's Avatar
    Join Date
    Jan 2008
    Location
    Poland, Warsaw
    Posts
    134
    Vote Rating
    4
      0  

    Default

    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);
            }
        };
    
    })());

  3. #23
    Sencha Premium Member
    Join Date
    Jul 2009
    Posts
    33
    Vote Rating
    3
      0  

    Default Still have a combobox display bug

    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
            });
        }
    Attached Images Attached Images

  4. #24
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,626
    Vote Rating
    54
      0  

    Default

    You got the latest code which aligns the list with the input el rather than the wrap el?
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  5. #25
    Sencha Premium Member
    Join Date
    Jul 2009
    Posts
    33
    Vote Rating
    3
      0  

    Default

    > 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.

  6. #26
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,626
    Vote Rating
    54
      0  

    Default

    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
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  7. #27
    Sencha Premium Member
    Join Date
    Jul 2009
    Posts
    33
    Vote Rating
    3
      0  

    Default

    Quote Originally Posted by Animal View 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
    Thanks for your help

    Here a fix for all that people that do not want to wait till the fix is released

    Code:
    Ext.sequence(Ext.form.ComboBox.prototype, "restrictHeight", function() {
        this.list.alignTo(this.el, this.listAlign);
    });

  8. #28
    Sencha User
    Join Date
    Mar 2007
    Posts
    210
    Vote Rating
    1
      0  

    Default

    You can pass helpText as a config option for the field and use Ext.preg if you change the init to this:
    PHP Code:
        init : function(f) {
          
    f.helpAlign this.align;
          if (
    'object' != typeof this.helpText)
            
    f.helpText this.helpText;
          
    f.afterRender f.afterRender.createSequence(afterFieldRender);
        } 
    add the Ext.preg at the end of the file:
    PHP Code:
    Ext.preg('fieldHelp'Ext.ux.FieldHelp); 
    Then you can create the field like this:
    PHP Code:
    new Ext.form.TextField ({
      
    name'username',
      
    fieldLabel'User Name',
      
    helpText'Users Full Name',
      
    plugins: [ 'fieldHelp' ]
    }); 
    or:
    PHP Code:
    new Ext.form.TextField ({
      
    name'username',
      
    fieldLabel'User Name',
      
    plugins: [ new Ext.ux.FieldHelp('Users Full Name') ]
    }); 

  9. #29
    Ext Premium Member
    Join Date
    Jul 2007
    Posts
    15
    Vote Rating
    0
      0  

    Default

    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,

  10. #30
    Ext Premium Member
    Join Date
    Jul 2007
    Posts
    15
    Vote Rating
    0
      0  

    Default

    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,

Page 3 of 4 FirstFirst 1234 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •