1. #1
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default Field help text plugin.

    Field help text plugin.


    A very simple plugin inspired by http://extjs.com/forum/showthread.php?t=33162

    It appends a help message above or below a Field.

    eg:



    Code:
    Ext.ux.FieldHelp = Ext.extend(Object, (function(){
        function syncInputSize(w, h) {
            this.el.setSize(w, h);
        }
    
        function afterFieldRender() {
            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);
            }
            this.wrap[this.helpAlign == 'top' ? 'insertFirst' : 'createChild']({
                cls: 'x-form-helptext',
                html: this.helpText
            });
        }
    
        return {
            constructor: function(t, align) {
                this.helpText = t;
                this.align = align;
            },
        
            init: function(f) {
                f.helpAlign = this.align;
                f.helpText = this.helpText;
                f.afterRender = f.afterRender.createSequence(afterFieldRender);
            }
        };
    })());
    CSS:
    Code:
    .x-form-helptext {
        font-size: 9px;
        color: #888;
    }

  2. #2
    Ext Premium Member
    Join Date
    Apr 2009
    Posts
    72
    Vote Rating
    0
    MH61 is on a distinguished road

      0  

    Default


    How do i apply this to a text box, do i have to create a FieldHelp object and then add it to my textfield, or is there a property i can set on my textfield (i tried both fieldHelp and helptext as properties)

  3. #3
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    It's a plugin. You use it in the standard way plugins are used: In the plugins config.

    Code:
        plugins: [ new Ext.ux.FieldHelp('Some help text') ],

  4. #4
    Ext Premium Member
    Join Date
    Apr 2009
    Posts
    72
    Vote Rating
    0
    MH61 is on a distinguished road

      0  

    Default


    Thanks, I guess i don't know the difference between an extension and a plugin.
    It looks nice - just what I was looking for

  5. #5
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Vote Rating
    80
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    Nige!! this should be in the framework.

    MH61, an "extension" extends an Ext JS class.

    a "Plugin" generally extends Object (or observable in some cases) and is utilized by an Ext JS class. I'm going to be adding a chapter dedicated to extensions and plugins in Ext JS in Action

  6. #6
    Sencha User galdaka's Avatar
    Join Date
    Mar 2007
    Location
    Spain
    Posts
    1,166
    Vote Rating
    -1
    galdaka is an unknown quantity at this point

      0  

    Default


    Hi,

    Is not the same effect that??:

    PHP Code:
    Ext.form.Field.prototype.msgTarget 'under'
    Greetings,

  7. #7
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Vote Rating
    80
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    That's for error messages though.

  8. #8
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,663
    Vote Rating
    6
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    Hi Animal,

    that's a great addition (imho should be in core)

    What's about add a property "position" that let render the help text on top or bottom of the field?
    From semantic i would like to have it before the field, visual looks nicer after because of Alignement.
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  9. #9
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Done. The CSS has been updated. clear: both was unnecessary.

  10. #10
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,663
    Vote Rating
    6
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    superb, thx!
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."