[CLOSED] Erratic field focus when multiple fields have selectOnFocus="true"

  1. #1

    [CLOSED] Erratic field focus when multiple fields have selectOnFocus="true"

    Hi,

    We're experiencing a strange issue with field focus problems and the SelectOnFocus property.

    Using the simple test case below the field context should be auto selected on focus which works the first few times, and then the focus will erratically switch between fields. The easiest way to reproduce the issue:

    1. Click into one of the fields
    2. Click into a different field
    3. Switch focus away from the browser so some other app you have open
    4. Switch focus back to the browser by clicking into one of the fields.

    The browser will now be switching focus between the fields rather than the expected behaviour of focusing and selecting the text in the field.



    Using Chrome Version 54.0.2840.99 m on Windows 10 with latest code from SVN /premium/2 branch.


    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    
    
    
    <!DOCTYPE html>
    
    
    <html>
    <head runat="server">
        <title>NumberField - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    </head>
    <body>
        <ext:ResourceManager runat="server" />
    
    
        <h1>NumberField</h1>
    
    
        <ext:FormPanel
            ID="Panel1"
            runat="server"
            Title="Simple Form"
            Width="210"
            Frame="true"
            Layout="Form"
            BodyPadding="5">
            <FieldDefaults SelectOnFocus="True">
            </FieldDefaults>
            <Items>
                <ext:NumberField MinValue="0" AllowDecimals="True" DecimalPrecision="2" runat="server" Text="0"
                    Flex="1" LabelAlign="Top" FieldCls="opus-field editable centered"
                    AllowBlank="False" FieldLabel="Setups" LabelSeparator="" />
                <ext:NumberField MinValue="0" AllowDecimals="True" DecimalPrecision="2" runat="server" Text="0"
                    Flex="1" LabelAlign="Top" FieldCls="opus-field editable centered"
                    AllowBlank="False" FieldLabel="Setups" LabelSeparator="" />
                <ext:NumberField MinValue="0" AllowDecimals="True" DecimalPrecision="2" runat="server" Text="0"
                    Flex="1" LabelAlign="Top" FieldCls="opus-field editable centered"
                    AllowBlank="False" FieldLabel="Setups" LabelSeparator="" />
                <ext:Container runat="server" ColumnWidth="0.1" Layout="Form">
                    <Items>
                        <ext:NumberField MinValue="0" AllowDecimals="True" DecimalPrecision="2" runat="server" Text="0"
                            Flex="1" LabelAlign="Top" FieldCls="opus-field editable centered"
                            AllowBlank="False" FieldLabel="Setups" LabelSeparator="" />
                    </Items>
                </ext:Container>
                <ext:Container runat="server" ColumnWidth="0.1" Layout="Form">
                    <Items>
                        <ext:NumberField MinValue="0" AllowDecimals="True" DecimalPrecision="2" runat="server"
                            Flex="1" Name="CutSides" LabelAlign="Top" FieldCls="opus-field editable centered" Text="0"
                            AllowBlank="False" FieldLabel="Sides" LabelSeparator="" />
                    </Items>
                </ext:Container>
                <ext:Container runat="server" ColumnWidth="0.2" Layout="Form">
                    <Items>
                        <ext:SelectBox runat="server" DisplayField="Name" ValueField="Id" Name="CutterId"
                            ReadOnly="True" ID="SelectCutter" LabelAlign="Top" QueryMode="Local" TriggerAction="All"
                            AllowBlank="True" FieldLabel="Machine" Flex="1" FieldCls="opus-field autopick">
                            <Store>
                                <ext:Store runat="server"
                                    AutoDataBind="true">
                                    <Model>
                                        <ext:Model runat="server" IDProperty="Id">
                                            <Fields>
                                                <ext:ModelField Name="Id" Type="Int" />
                                                <ext:ModelField Name="Name" Type="String" />
                                            </Fields>
                                        </ext:Model>
                                    </Model>
                                </ext:Store>
                            </Store>
                            <Triggers>
                                <ext:FieldTrigger Icon="Clear" Tag="Clear" />
                            </Triggers>
                            <Listeners>
                                <TriggerClick Handler="if (tag == 'Clear') { this.setValue('', true); }" />
                            </Listeners>
                        </ext:SelectBox>
                    </Items>
                </ext:Container>
                <ext:Container runat="server" ColumnWidth="0.1" Layout="Form">
                    <Items>
                        <ext:DisplayField runat="server" Name="CutSetupCost" Note="Per setup" FieldLabel="&nbsp;"
                            LabelAlign="Top" LabelSeparator="">
                        </ext:DisplayField>
                    </Items>
                </ext:Container>
                <ext:Container runat="server" ColumnWidth="0.1" Layout="Form">
                    <Items>
                        <ext:DisplayField runat="server" Name="CutCostPer1000" Note="Per 1000" FieldLabel="&nbsp;"
                            LabelAlign="Top" LabelSeparator="">
                        </ext:DisplayField>
                    </Items>
                </ext:Container>
                <ext:Container runat="server" ColumnWidth="0.1" Layout="Form">
                    <Items>
                        <ext:DisplayField runat="server" Text="" />
                    </Items>
                </ext:Container>
                <ext:Container runat="server" ColumnWidth="0.1" Layout="Form" Cls="opus-v-divider">
                    <Items>
                        <ext:DisplayField runat="server" Flex="1" Name="CutSetupTotalCost" HideLabel="True"
                            Note="Cost">
                        </ext:DisplayField>
                    </Items>
                </ext:Container>
    
    
            </Items>
        </ext:FormPanel>
    
    
    </body>
    </html>
    Attached Thumbnails Click image for larger version. 

Name:	Focus Issue.jpg 
Views:	59 
Size:	12.4 KB 
ID:	24789  
    Last edited by fabricio.murta; Jan 21, 2017 at 3:13 PM. Reason: no user feedback for 7+ days
  2. #2
    Hello @paulc!

    I think that's a known bug on 2.x, but you didn't specify if it happens with a specific browser or any web browser.

    Did you find the following thread before you opened this one?

    - #313: Using ComboBox with SelectOnFocus and SelectOnTab is causing a deadlock(Webkit Browsers)

    It leads for a possible workaround here: Post #4 at Visual Errors for Two text fields with SelectOnFocus = true.

    Let us know if this helps or not before we jump in the issue with more details. Unfortunately the two threads above didn't have the feedback from the users when the workaround was provided, so we're looking forward for your feedback!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    As per my original thread, It happens "Using Chrome Version 54.0.2840.99 m on Windows 10 with latest code from SVN /premium/2 branch."
    I will try the fix as described in the other thread, but in production we already override the behaviour so it will take some time to merge the changes.
  4. #4
    Ops! I read the part of the svn branch but for some reason during the response and investigation I skipped that bit when I was double checking your post!.. Anyway, that points towards this issue and really looks like the same thing. We're looking forward for your response!
    Fabrício Murta
    Developer & Support Expert
  5. #5
    Hi, no problem. I've applied the fix in our dev. environment and it appears to be working. I'll update the thread once we get this through testing and into production.

    Thanks,
    Paul.
  6. #6
    Hello Paul!

    Thank you very much for your feedback, glad the fix helped!
    Fabrício Murta
    Developer & Support Expert
  7. #7
    Hello again Paul!

    We're not sure we should be closing this thread as you mentioned posting an update to this thread as soon as you tested it in production. We'll leave this open for an additional 7 business days (at least) and close it afterwards. Anyway, whenever you have time you can always post your follow-up here, regardless of being open or closed.

    Hope to hear back from you soon!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. Replies: 1
    Last Post: Aug 21, 2015, 9:51 AM
  2. Replies: 8
    Last Post: Aug 11, 2015, 1:52 PM
  3. Replies: 7
    Last Post: Jan 20, 2015, 6:06 PM
  4. [CLOSED] Hidden="true" behaves as Visible="false"
    By marco.morreale in forum 2.x Legacy Premium Help
    Replies: 5
    Last Post: May 28, 2012, 3:17 PM
  5. Replies: 5
    Last Post: May 02, 2012, 5:37 PM

Tags for this Thread

Posting Permissions