[EXTJS5 Study notes] 22nd section EXTJS5 using BEFORELABELTPL configuration to add the required option to the label asterisk flag

This address: http://blog.csdn.net/sushengmiyan/article/details/39395753

Official Example: HTTP://DOCS.SENCHA.COM/EXTJS/5.0/APIDOCS/#!/API/EXT.FORM.LABELABLE-CFG-BEFORELABELTPL

This article Sushengmiyan

--------------------------------------------------------------------------------------------------------------- ---------------------

On the registration page to get the information to fill in the interface, we can see the required option of the logo * this thing. In ext, we can create a label through Fieldlabel, but there is no option to explicitly indicate the configuration with the required options, just looked at the official examples/kitchensink/#form-contact example, Found a BEFORELABELTPL configuration that can be used to set the * flag for required options.

Look at the effect first:

On the left side of the label, the * required sign is added.

Implementation method:

Items:[{xtype: ' TextField ', Name: ' username ', labelwidth:50,    Fieldlabel: ' username ', beforelabeltexttpl: [' <span Style= "Color:red;font-weight:bold" data-qtip= "required options" >*</span> '],//allowblank:false,emptytext: ' username or email address '  },{xtype: ' TextField ', Name: ' Password ', Labelwidth:50,inputtype: ' Password ',     fieldlabel: ' Secret  code ', BEFORELABELTEXTTPL: [' <span style= ' color:red;font-weight:bold ' data-qtip= ' required options ' >*</span> '],// Allowblank:false,emptytext: ' Please enter your password '  }]

By setting the BEFORELABELTEXTTPL configuration, we can avoid the rude way of writing an asterisk in front of the label and then writing the label name, so that you can customize the label configuration for the option.

Also, the label display, I want to the ' User name ' and ' password ' two pairs of it, just want to add a space in the middle of the password, but I try to find that is not OK, do not know whether it is ext bug or intentionally do so. Later found that you can set the label alignment, set to the right alignment, then the code word of the password and the name of the user name is aligned. But the front font is still not aligned, in contrast, a little more beautiful.

Fielddefaults: {labelalign: ' Right ', Labelwidth:115,msgtarget: ' Side '},

[EXTJS5 Study notes] 22nd section EXTJS5 using BEFORELABELTPL configuration to add the required option to the label asterisk flag