1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    90
    Vote Rating
    2
    darkhorni is on a distinguished road

      0  

    Default afterSubTpl in ComboBox

    afterSubTpl in ComboBox


    I'm trying to use afterSubTpl but I have no idea how to use it. This what I have tried so far.

    Code:
    {
        xtype: "combo",
        displayField: 'department_abvr',
        valueField: 'department_abvr',
        queryMode: 'local',
        typeAhead: true,
        forceSelection: true,
        fieldLabel: 'Department',
        name: 'department',
        store: departmentStore,
        allowBlank: false,
        afterSubTpl: '{department_name}'
    }
    What I'm missing here?

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

      0  

    Default


    Nothing I think. I don't think we are supporting it properly.

    Try this override

    Code:
    Ext.override('Ext.form.Labelable, {
        getLabelableRenderData: function() {
            var me = this,
                data,
                tempEl,
                topLabel = me.labelAlign === 'top';
    
            if (!Ext.form.Labelable.errorIconWidth) {
                tempEl = Ext.getBody().createChild({style: 'position:absolute', cls: Ext.baseCSSPrefix + 'form-invalid-icon'});
                Ext.form.Labelable.errorIconWidth = tempEl.getWidth() + tempEl.getMargin('l');
                tempEl.remove();
            }
    
            data = Ext.copyTo({
                inFormLayout   : me.ownerLayout && me.ownerLayout.type === 'form',
                inputId        : me.getInputId(),
                labelOnLeft    : !topLabel,
                hideLabel      : !me.hasVisibleLabel(),
                fieldLabel     : me.getFieldLabel(),
                labelCellStyle : me.getLabelCellStyle(),
                labelCellAttrs : me.getLabelCellAttrs(),
                labelCls       : me.getLabelCls(),
                labelStyle     : me.getLabelStyle(),
                bodyColspan    : me.getBodyColspan(),
                externalError  : !me.autoFitErrors,
                errorMsgCls    : me.getErrorMsgCls(),
                errorIconWidth : Ext.form.Labelable.errorIconWidth
            },
            me, me.labelableRenderProps, true);
    
            // Apply the renderData to the labelableRenderData
            Ext.apply(data, me.renderData);
    
            me.getInsertionRenderData(data, me.labelableInsertions);
    
            return data;
        }
    });
    And then configure your field with

    Code:
            afterSubTpl: ['{department_name}'],
            renderData: {"department_name": "Department S"}

Thread Participants: 1

Tags for this Thread