Jan 08, 2015, 8:46 AM
[CLOSED] TextField validation - cosmetic issue
Hi,
The issue was introduced in Ext 3.0. In previous version I was not experiencing that.
When validator is set to MsgTarget="Under" then if you start typing (password in case of my example) then empty space (gap) is added under text field and stays there. It looks like the placeholder is added after first character typed into the TextField.
Interesting thing is that the issue is not present if I change ScriptMode to Debug.
Also MsgTarget="Side" is not working great. I am not sure how about previous versions of Ext but I would assume that TextField should return to it's original width when alert icon is hidden. (but It might be only my wish)
Thank you
The issue was introduced in Ext 3.0. In previous version I was not experiencing that.
When validator is set to MsgTarget="Under" then if you start typing (password in case of my example) then empty space (gap) is added under text field and stays there. It looks like the placeholder is added after first character typed into the TextField.
Interesting thing is that the issue is not present if I change ScriptMode to Debug.
<%@ Page Language="C#" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v3 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager
runat="server"
ScriptMode="Release" />
<ext:FormPanel
runat="server"
ID="pnlLogin"
Title="User Login"
Width="350"
Frame="true"
BodyPadding="10"
DefaultAnchor="100%">
<Listeners>
<AfterRender Handler="
if (#{txtEmailAddress}.getValue().length === 0) {
#{txtEmailAddress}.focus(false, 100);
}
else {
#{txtPassword}.focus(false, 100);
} " />
</Listeners>
<Items>
<ext:TextField
runat="server"
MsgTarget="Under"
ID="txtEmailAddress"
Text="my@email.com"
AllowBlank="false"
FieldLabel="Email Address:"
Vtype="email"
EmptyText="email address">
<CustomConfig>
<ext:ConfigItem
Name="tooltip"
Value="Enter your email address" />
</CustomConfig>
</ext:TextField>
<ext:TextField
runat="server"
ID="txtPassword"
MsgTarget="Under"
AllowBlank="false"
FieldLabel="Password:"
EmptyText="password"
InputType="Password"
BlankText="Password is required." />
<ext:Label
runat="server"
ID="lblInvalidLogin"
StyleSpec="color:red;margin-left:100px"
Text="Provided credentials are invalid."
Icon="exclamation"
HideMode="Visibility"
Hidden="true">
<Listeners>
<Show Handler="#{btnLogin}.enable()" />
</Listeners>
</ext:Label>
</Items>
<Buttons>
<ext:Button
runat="server"
ID="btnLogin"
Text="Log in"
FormBind="true"
MarginSpec="0 5 8 0">
<Listeners>
<Click Handler="#{lblInvalidLogin}.hide();
item.focus();
item.disable();" />
</Listeners>
</ext:Button>
</Buttons>
</ext:FormPanel>
</form>
</body>
</html>
Also MsgTarget="Side" is not working great. I am not sure how about previous versions of Ext but I would assume that TextField should return to it's original width when alert icon is hidden. (but It might be only my wish)
Thank you
Last edited by Daniil; Jan 15, 2015 at 12:57 PM.
Reason: [CLOSED]