[HELPED] 3.2 Login Page - Invalid Password Error Message

[JPinTO]

On the Valence3.2 Login Page, if a user enters in an invalid user id or password, a red box appears around the textbox. The user must then mouseover on the textbox before the actual error message is displayed.

This is not particularly intuitive from a normal user's perspective. Valence 3.1 portal actually displayed the error below the text box.

Is this a design feature or a flaw? Can the behavior be customized?

Thanks - JP

[BRandle]

Yes, you can customize the error text setting. The location of the error message text is controlled by the Ext field config setting msgTarget. The default msgTarget is 'qtip' which puts the red box around the textbox and shows the error text when you hover over the field. In Valence 3.1 the Portal changes the default value for msgTarget to 'under'.

You can customize Valence 3.2 to show the message text like Valence 3.1 by using Hook.js. Add to the Portal.Hook constructor function:

Ext.define('Portal.Hook',{
    singleton : true,
    constructor : function(){
        Ext.form.Field.prototype.msgTarget = 'under';
    
    ...

Changing the prototype.msgTarget will make 'under' the default for all Ext fields. You will need to be on the latest update of Valence 3.2 (20130401.0) to use Hook.js and the Valence documentation is located here.

[JPinTO]

I added the

Ext.form.Field.prototype.msgTarget = 'under'

to the top of the hook.js constructor: Function() and that did the trick.

Thanks.