ExtJS 4 - Mark a red asterisk on an required field

Question

I have this problem where I need to add a red asterisk beside a fieldLabel when a field is marked as \"required\" (or allowBlank: false)

In

Answer 1

Actually I think using fieldSubTpl and/or labelableRenderTpl to add the * is a cleaner approach than using the event listener. Events can be stopped, listeners can be detached.

I think OP(Lionel Chan)'s concern was that using Ext.override is kinda hacky and he's 100% right. But if we pass the custom tpl in at the form configuration level it's not that bad:

Ext.create('Ext.form.Panel',{
    defaults:{
        fieldSubTpl:['name="{name}" ', 
        'size="{size}" ', 
        'tabIndex="{tabIdx}" ', 
        'class="{fieldCls} {typeCls}" autocomplete="off" />',
        '',
        '*',
        '',
        {
            compiled: true, 
            disableFormats: true
    }]},
    items : [{
        xtype : 'textfield',.....

There could be something wrong with the tpl, i haven't tried.