PDA

View Full Version : Labelable 'labelStyle' is ignored



usan_AT
22 Apr 2014, 7:56 AM
When setting labelStyle of a DisplayField - that style gets ignored. Although API lists 'labelStyle' as a valid config, it is missing in the source definition (http://docs-origin.sencha.com/extjs/5.0.0/apidocs/source/Labelable.html#Ext-form-Labelable-cfg-labelStyle)

usan_AT
22 Apr 2014, 8:20 AM
For a workaround - labelCls can be used instead.

aleksandy
17 Jul 2014, 4:19 AM
Ext.override(Ext.form.Labelable, {
getLabelableRenderData: function() {
var me = this,
labelAlign = me.labelAlign,
topLabel = (labelAlign === 'top'),
rightLabel = (labelAlign === 'right'),
sideError = (me.msgTarget === 'side'),
underError = (me.msgTarget === 'under'),
errorMsgCls = me.errorMsgCls,
labelPad = me.labelPad,
labelWidth = me.labelWidth,
labelClsExtra = me.labelClsExtra || '',
errorWrapExtraCls = sideError ? me.errorWrapSideCls : me.errorWrapUnderCls,
labelStyle = me.labelStyle || '',
labelInnerStyle = '',
labelVisible = me.hasVisibleLabel(),
autoFitErrors = me.autoFitErrors,
defaultBodyWidth = me.defaultBodyWidth,
bodyStyle, data;

if (!/;$/.test(labelStyle)) {
labelStyle += ';';
}

if (topLabel) {
labelClsExtra += ' ' + me.topLabelCls;
if (labelPad) {
labelInnerStyle = 'padding-bottom:' + labelPad + 'px;';
}
if (sideError && !autoFitErrors) {
labelClsExtra += ' ' + me.topLabelSideErrorCls;
}
} else {
if (rightLabel) {
labelClsExtra += ' ' + me.rightLabelCls;
}
if (labelPad) {
labelStyle += me.getHorizontalPaddingStyle() + labelPad + 'px;';
}
labelStyle += 'width:' + (labelWidth + (labelPad ? labelPad : 0)) + 'px;';

labelInnerStyle = 'width:' + labelWidth + 'px';
}

if (labelVisible) {
if (!topLabel && underError) {
errorWrapExtraCls += ' ' + me.errorWrapUnderSideLabelCls;
}
} else {
labelStyle += 'display:none';
}

if (defaultBodyWidth) {

bodyStyle = 'min-width:' + defaultBodyWidth + 'px;max-width:' +
defaultBodyWidth + 'px;';
}

data = {
id: me.id,
inputId: me.getInputId(),
labelCls: me.labelCls,
labelClsExtra: labelClsExtra,
labelStyle: labelStyle,
labelInnerStyle: labelInnerStyle,
labelInnerCls: me.labelInnerCls,
unselectableCls: Ext.Element.unselectableCls,
bodyStyle: bodyStyle,
baseBodyCls: me.baseBodyCls,
fieldBodyCls: me.fieldBodyCls,
extraFieldBodyCls: me.extraFieldBodyCls,
errorWrapCls: me.errorWrapCls,
errorWrapExtraCls: errorWrapExtraCls,
renderError: sideError || underError,
invalidMsgCls: sideError ? me.invalidIconCls : underError ? me.invalidUnderCls : '',
errorMsgCls: errorMsgCls,
growCls: me.grow ? me.growCls : '',
errorWrapStyle: (sideError && !autoFitErrors) ?
'visibility:hidden' : 'display:none',
fieldLabel: me.getFieldLabel(),
labelSeparator: me.labelSeparator
};

me.getInsertionRenderData(data, me.labelableInsertions);

return data;
}
});